javascript 选择器querySelector

最新推荐文章于 2025-02-24 23:24:00 发布

最新推荐文章于 2025-02-24 23:24:00 发布 · 405 阅读

文章标签：

#javascript #ViewUI

javascript 专栏收录该内容

161 篇文章

订阅专栏

本文详细介绍了JavaScript函数querySelector的使用方式，包括其接受的三种类型参数：id(#), class(.), 标签，并通过代码示例展示了如何在HTML中获取特定的DOM节点。此外，还对比了querySelector与jQuery选择器的区别。

javascript函数querySelector介绍


  querySelector用于获得dom节点，可以接受三种类型的参数：id(#)，class(.)，标签。很像jquery的选择器。不过只能返回一个子孙元素，但是jquery选择器的话，可以返回一组元素集合。下面的代码示例：

<body>

        <div id="query">id</div>

        <div class="query">class</div>

</body>

<script>

   var htmlStr= document.querySelector("body #query").innerHTML，//id

   htmlStr=document.querySelector("body div").innerHTML,//只返回第一个子孙元素

   htmlStr=document.querySelector( "body .query).innerHTML //class

</script>   

 这个函数适用 IE8+，chrome，firefox