JavaScript 的 document.querySelector() 和 jQuery $() 方法一样吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14115375/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JavaScript's document.querySelector() same as jQuery $() method?
提问by ModernDesigner
I have been wondering why people glorified jQuery's $(".myClass")method when JavaScript has a generic document.querySelector(). Is there something I'm missing here? Why not just use the documentobject?
我一直在想,$(".myClass")当 JavaScript 有一个泛型document.querySelector(). 有什么我在这里想念的吗?为什么不直接使用document对象?
I am completely new to JavaScript, so is there some type of con to document.querySelector()that I am not aware of?
我对 JavaScript 完全陌生,所以有document.querySelector()什么我不知道的骗局吗?
I'd really like to know, because I ran across something like this earlier and I'm wondering if it might help a situation I'm in:
我真的很想知道,因为我之前遇到过这样的事情,我想知道它是否对我所处的情况有所帮助:
var retrieve = function( s ) {
return document.querySelector( s );
};
retrieve(".myClass").style.display = "block";
Note
笔记
I have nothing against jQuery at all. In fact, I love it. However, I'd rather not cheat myself using the easy pre-made ready-to-use tools when I'm just now trying to learn JavaScript.
我完全不反对 jQuery。事实上,我喜欢它。但是,当我刚刚尝试学习 JavaScript 时,我宁愿不使用简单的预制即用工具来欺骗自己。
Any help would be much appreciated! :-)
任何帮助将非常感激!:-)
采纳答案by Mr. Polywhirl
Cross-browser and legacy support.
跨浏览器和遗留支持。
You can also use getElementsByClassName() if you don't want to use Jquery. There is a response to a post on devshedby user: KorRedDevil that may be of interest to you.
如果您不想使用 Jquery,也可以使用 getElementsByClassName()。用户对 devshed上的帖子有一个回复:KorRedDevil,您可能会感兴趣。
I took your function from your post and made it return an array. After you have that array of elements, all you have to do is loop over them. You can try it out here.
我从你的帖子中获取了你的函数并让它返回一个数组。在您拥有该元素数组后,您所要做的就是遍历它们。你可以在这里试一试。
Javascript:
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';
Markup:
标记:
<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>
回答by John Slegers
About a decade ago the top browsers were IE6, Netscape 8 and Firefox 1.5. Back in those days, there were few cross-browser ways to select an element from the DOM besides Document.getElementById().
大约十年前,顶级浏览器是 IE6、Netscape 8 和 Firefox 1.5。在那个年代,除了Document.getElementById().
So, when jQuery was released back in 2006, it was pretty revolutionary. Back then, jQuery set the standard for how to easily select / change HTML elements and trigger events, because its flexibility and browser support were unprecedented.
因此,当 jQuery于 2006 年发布时,它是非常具有革命性的。当时,jQuery 为如何轻松选择/更改 HTML 元素和触发事件设定了标准,因为它的灵活性和浏览器支持是前所未有的。
Now, more than a decade later, a lot of features that made jQuery so popular have become included in the JavaScript standard. Instead of jQuery's $selection.on(), you can now use EventTarget.addEventListener(). Instead of jQuery's $(), you can now now use Document.querySelectorAll()... etc... which begs the question of why we should use jQuery at all. And indeed, people are increasingly wondering whether we should use jQuery at all. So, if you think you understand JavaScript well enough to do without jQuery, please do! Don't feel forced to use jQuery, just because so many others are doing it!
现在,十多年后,许多让 jQuery 如此流行的特性已经包含在 JavaScript 标准中。相反jQuery的的$selection.on(),你现在可以使用EventTarget.addEventListener()。代替 jQuery 的$(),您现在可以使用Document.querySelectorAll()... 等等... 这引出了我们为什么应该使用 jQuery 的问题。事实上,人们越来越想知道我们是否应该使用 jQuery。所以,如果你认为你对 JavaScript 的了解足以在没有 jQuery 的情况下完成,请这样做!不要因为有太多人在使用 jQuery 而感到被迫使用 jQuery!
Anyway, to understand why jQuery is so popular, it's important to understand where we're coming from!
无论如何,要了解 jQuery 为何如此受欢迎,重要的是要了解我们来自哪里!

