与jQuery $()方法相同的JavaScript的document.querySelector()？

Question

我一直想知道为什么$(".myClass")当JavaScript有一个泛型时人们赞美jQuery的方法document.querySelector().这里有什么我想念的吗？为什么不直接使用该document对象？

我是JavaScript的新手,所以document.querySelector()我不知道有哪些类型的con ？

我真的很想知道,因为我之前遇到过这样的事情,我想知道它是否有助于我所处的情况:

var retrieve = function( s ) {
    return document.querySelector( s );
};

retrieve(".myClass").style.display = "block";

---

注意

我根本没有反对jQuery的东西.事实上,我喜欢它.但是,当我刚刚尝试学习JavaScript时,我宁愿不使用简单的预制即用工具来欺骗自己.

任何帮助将非常感激!:-)

Answer 1

跨浏览器和传统支持.

如果您不想使用Jquery,也可以使用getElementsByClassName().对用户发布的帖子有回复:KorRedDevil可能对您感兴趣.

我从你的帖子中取出了你的函数并使它返回一个数组.拥有该元素数组后,您所要做的就是遍历它们.你可以在这里试试.

Javascript:

var retrieve = function(className) {
    return document.getElementsByClassName(className);
};

var elements = retrieve('foo');
for (var i = 0; i < elements.length; i++)
    elements[i].style.background = '#dfd';

加价:

<p class="foo">foo</p>
<p class="bar">bar</p>
<p class="foo">foo</p>
<p class="foo">foo</p>
<p class="bar">bar</p>
<p class="bar">bar</p>

Answer 2

大约十年前,顶级浏览器分别是IE6,Netscape 8和Firefox 1.5.在那些日子里,几乎没有跨浏览器方式从DOM中选择元素Document.getElementById().

因此,当jQuery 在2006年发布时,它是非常具有革命性的.当时,jQuery为如何轻松选择/更改HTML元素和触发事件设置了标准,因为它的灵活性和浏览器支持是前所未有的.

现在,十多年后,许多使jQuery如此受欢迎的功能已经包含在JavaScript标准中.$selection.on()您现在可以使用而不是jQuery EventTarget.addEventListener().而不是jQuery $(),你现在可以使用Document.querySelectorAll()......等...这就引出了为什么我们应该使用jQuery的问题.事实上,人们越来越想知道我们是否应该使用jQuery.所以,如果你认为你很好地理解JavaScript而没有jQuery,请做!不要觉得被迫使用jQuery,只是因为有很多人在做这件事!

无论如何,要理解为什么jQuery如此受欢迎,了解我们的来源非常重要!