javaScript中的querySelector和querySelectorAll


querySelector和querySelectorAll是W3C提供的 新的查詢接口,其主要特點如下:

1、querySelector只返回匹配的第一個元素,如果沒有匹配項,返回null。 
2、querySelectorAll返回匹配的元素集合,如果沒有匹配項,返回空的nodelist(節點數組)。 
3、返回的結果是靜態的,之后對document結構的改變不會影響到之前取到的結果。 
 
這兩個方法都可以接受三種類型的參數:id(#),class(.),標簽,很像jquery的選擇器。
 
var obj = document.querySelector("#id");
var obj = document.querySelector(".classname");
var obj = document.querySelector("div");
var el = document.body.querySelector("style[type='text/css'], style:not([type])");
var elements = document.querySelectorAll("#score>tbody>tr>td:nth-of-type(2)");
var elements = document.querySelectorAll("#id1, #id2, .class1, class2, div a, #list li img");
注意事項:
           1)當選擇器匹配多個元素時,只能找到第一個;
           2)querySelector  是 H5中 新增的方法,不支持IE8及以下;
目前IE8+,ff,chrome都支持此api

原文鏈接:https://blog.csdn.net/weixin_42160828/article/details/80634520


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM