document.querySelector用法

document.querySelector是一种HTML DOM API方法，用于通过选择器选择文档中的第一个匹配元素。它的用法非常简单，只需要传入一个选择器作为参数，然后它会返回文档中第一个匹配选择器的元素。

例如，如果你想通过类名选择元素，你可以使用以下代码：

const firstElementWithClass = document.querySelector('.my-class');
这将返回文档中具有类名为"my-class"的第一个元素。

除了类名选择器，你还可以使用其他类型的选择器，例如标签选择器、ID选择器、属性选择器等。

值得一提的是，querySelector只返回第一个匹配的元素。如果你想要选择所有匹配的元素，你可以使用document.querySelectorAll方法。该方法与querySelector类似，但返回的是一个节点列表，而不仅仅是一个元素。

总结起来，document.querySelector方法提供了一种简单和灵活的方式来选择文档中的元素，你可以根据需要传入不同的选择器来获取所需的元素。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [document.querySelector()方法](https://blog.csdn.net/qq_44885775/article/details/124420956)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *3* [介绍函数用法：document.querySelector](https://blog.csdn.net/m0_57236802/article/details/130287312)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]