Question

我想知道我是否可以一起使用查询和javascript，因此我可以使用javascript选择一个元素，然后使用javascript来处理该元素。对不起，如果那没有意义。这是一个例子：

$('.nav_flag').src = "images/flags/"+userCountryLower+".gif";

这是否有效，如果不是如何使用常规javascript逐个获取元素。谢谢！

编辑：我知道JQUERY是JavaScript但是我想知道我是否可以混合使用jquery选择器和javascript'controller'来丢失更好的单词

Answer 1

jQuery IS Javascript。您可以将它们混合在一起。但你最好知道你在做什么。

在这种情况下，您可能希望使用.attr函数来设置属性值。

Answer 2

要回答你提出的问题，有几种方法可以获取jQuery对象，即$('some selector')返回的内容，并获取对底层DOM元素的引用。

您可以访问各个DOM元素，例如数组元素：

// update the src of the first matching element:
$(".nav_flag")[0].src = "images/flags/"+userCountryLower+".gif";

// if you're going to access more than one you should cache the jQuery object in
// a variable, not keep selecting the same thing via the $() function:
var navFlgEls = $(".nav_flag");
for (var i = 0; i < navFlgEls.length; i++) { ... }

但是当你可以使用jQuery's .each() method时，你不会手动循环遍历这些元素，注意在你提供的回调函数中this将被设置为当前的DOM元素：

$(".nav_flag").each(function() {
    this.src = "images/flags/"+userCountryLower+".gif";
});

但是，jQuery提供了一种使用一行代码设置属性的方法：

$(".nav_flag").attr("src", "images/flags/"+userCountryLower+".gif");

要回答问题的第二部分，在没有jQuery的情况下执行相同的操作，如果您不关心支持旧浏览器，则可以使用.getElementsByClassname()或.querySelectorAll()。

Answer 3

在jQuery中使用.attr()，而不是在这里混用两个。

$('.nav_flag').attr('src', "images/flags/"+userCountryLower+".gif");

在许多情况下，将jQuery与纯JavaScript混合是很好的，但是如果你已经包含了jQuery库，那么你也可以使用它。除非，就是说，你有一个jQuery中的操作比纯JavaScript中的相同操作更昂贵。

Answer 4

您也可以使用jQuery：

$('.nav_flag').attr("src", "images/flags/"+userCountryLower+".gif");

Answer 5

请记住，jQuery只是一个基于javascript构建的库。

对于任何jQuery对象，按订阅选择其元素将返回相应的dom元素。

e.g。

$('#foo')[0] // is equivalent to document.getElementById('foo');

Answer 6

您需要向jQuery对象添加索引以获取本机Javascript对象。变化：

$('.nav_flag').src = "images/flags/"+userCountryLower+".gif";

要：

$('.nav_flag')[0].src = "images/flags/"+userCountryLower+".gif";

要在Javascript中按类名获取元素，您可以使用：

document.getElementsByClassName( 'nav_flag' )[0].src = "images/flags/"+userCountryLower+".gif";

Answer 7

要回答您的问题，您可以使用.toArray()将jQuery对象转换为标准DOM元素数组。然后获取第一个元素或循环遍历数组以设置具有类的所有元素。

但是，使用attr或prop的纯jquery可以更容易地实现这一点，具体取决于版本：

$('.nav_flag').attr("src", "images/flags/"+userCountryLower+".gif");

或使用纯javascript：

if (navFlagElements = document.getElementsByClassName("nav_flag") && navFlagElements.length > 0) {
  navFlagElements[0].src = "images/flags/"+userCountryLower+".gif"
}

JQuery和Javascript可以混合在一起吗？

7 个答案: