编辑这个页面须要登录或更高权限！

HTML DOM querySelector() 方法

HTML DOM Document对象

querySelector()返回文档中与指定的选择器或选择器组匹配的第一个元素。

如果找不到匹配项，则返回null。

querySelector()方法仅返回与指定选择器匹配的第一个元素。要返回所有匹配项，请改用querySelectorAll()方法。

语法：

document.querySelector(selectors)
document.querySelector('h1');
测试看看‹/›

浏览器兼容性

表中的数字指定了完全支持querySelector()方法的第一个浏览器版本：

Method
querySelector()13.5103.28

参数值

参数描述
selectors包含一个或多个要匹配的选择器的字符串。此字符串必须是有效的CSS选择器字符串

技术细节

返回值：表示文档中与指定的CSS选择器集匹配的第一个元素的Element对象，如果不存在匹配项，则返回null。
例外情况：SyntaxError-指定的选择器字符串的语法无效
DOM版本：DOM级别1

更多实例

获取id="para"的第一个元素：

document.querySelector('#para');
测试看看‹/›

使用class="demo"获取第一个元素：

document.querySelector(".demo");
测试看看‹/›

获取文档中父元素为<div>元素的第一个<p>元素：

document.querySelector("div > p");
测试看看‹/›

相关参考

CSS教程：CSS选择器

CSS参考：CSS#id选择器

CSS参考：CSS .class选择器

DOM Document querySelectorAll()方法

DOM Document getElementsByClassName()方法

DOM Document getElementsByTagName()方法

HTML DOM Document对象

HTML DOM Element 对象HTML DOM Document 对象