混合使用Javascript和jQuery

Mixing Javascript and jQuery?

本文关键字：jQuery Javascript 混合      更新时间：2023-09-26

主要问题：是否可以使用JavaScript条件，然后使用一些jQuery代码？

下面是一个目前不起作用的例子：

<script>
//<![CDATA[ 
if (location.pathname == "/SearchResults.asp" 
|| location.pathname.indexOf("-s/") != -1 
|| location.pathname.indexOf("_s/") != -1) 
$('.colors_productname span').css("background-color", "#F7F7F7");
//]]> 
</script>

JavaScript条件是由我的电子商务平台（Volusion）提供的，只针对类别页面（jQuery是我做的）。我问他们，考虑到我的URL不包括"/SearchResults.asp"（其中一个实际上是"/Meats-s/3393.htm"），这个JavaScript代码是否仍然有效，但他们向我保证它应该仍然有效。

次要问题："location.pathname.indexOf"行做什么？

虽然可以混合使用，但重要的是要理解jQuery和原生Javascript对DOM元素的引用不同。

假设您有一个包含以下元素的文档：

<span id="message_location"><span>

要在常规Javascript中获得该元素，请执行以下操作：

var spanElement = document.getElementById("message_location");

然而，对于jQuery库，您将使用以下语法：

var $spanElement = $("#message_location");

在这里，您必须注意spanElement和$spanElement不是同一回事。一个是DOM元素，另一个是数组cum-jQuery对象，它包含一个值——span元素。

当从jQuery库和常规Javascript来回切换时，很容易混淆你真正指的是什么

（就我个人而言，每当我有一个对DOM元素的jQuery引用时，我总是以$开头变量名。这让我的生活变得简单…）

jQuery和JavaScript不是独立的语言。jQuery是用Javascript编写的库，因此任何有效的jQuery语句都是有效的Javascript语句。

问题2：location.pathname是您的域名后面的url的路径。

例如http://www.google.com/s/goo.html->路径名将返回s/goo.html

所以你的if条件是试图找出这个字符串是否包含子字符串"-s"。

您完全可以将它们混合在一起。

location.pathname.indexOf正在当前URL中搜索"_s/"或"-s/"的实例。如果URL不包含这些字符（或者等于"/SearchResults.asp"），则运行jquery代码。

您应该能够自由地混合这两者，注意使用JQuery选择器与常规Javascript dom元素，尽管两者并不总是相同的。（即类，多个选择器。）

jQuery只是一个提供有用方法的javascript对象。所以，是的，您可以同时使用vanilla-js和jQuery。
相关文章：