freeCodeCamp/guide/chinese/javascript/html-dom-queryselector/index.md

1.0 KiB
Raw Blame History

title localeTitle
HTML DOM querySelector() HTML DOM querySelector

Document方法querySelector()返回文档中与指定选择器或选择器组匹配的first Element。如果未找到匹配项则返回null。

HTML内容


<div id="id-example"></div> 
 <div class="class-example"></div> 
 <a>element-example</a> 

JavaScript内容

document.querySelector("#id-example"); // Returns the element with id "id-example" 
 document.querySelector(".class-example"); // Returns the element with class "class-example" 
 document.querySelector("a"); // Returns the "a" element 

注意querySelector()返回第一个匹配元素返回所有匹配项改为使用querySelectorAll方法。


<div id="example">First</div> 
 <div id="example">Second</div> 
document.querySelector("#example"); // Returns only the element containing 'First' 

更多信息:

MDN - document.querySelector