javascript 选择器querySelector

最新推荐文章于 2025-06-16 18:39:32 发布

sfSam

最新推荐文章于 2025-06-16 18:39:32 发布

阅读量382

点赞数

分类专栏： javascript 文章标签： javascript ViewUI

javascript 专栏收录该内容

161 篇文章

订阅专栏

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

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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