javascript常用的選擇器有getElementById()
getElementsByName()
getElementsByTagName()
getElementsByClassName()
querySelector()
querySelectorAll()
getElementById('id') :返回對指定ID的第一個(gè)對象的引用法挨。
getElementsByName('name'):返回文檔中name屬性為name值的元素蔗坯,因?yàn)閚ame屬性值不是唯一的践磅,
所以查詢到的結(jié)果有可能返回的是一個(gè)數(shù)組洋满,而不是一個(gè)元素太伊。
getElementsByTagName('tagname'):返回文檔中指定標(biāo)簽的元素探入。
getElementsByClassName('className'):返回文檔中所有類名為className的元素偿乖。
querySelector(selector):返回文檔中匹配指定css選擇器的第一個(gè)元素厂财。
querySelector('.className')
querySelector('#id')
querySelector('[attributte]')
querySelector('tag')
層疊選擇器:
elem = document.querySelector('body > div > form');
elem = document.querySelector('body > div > form.tsf.nj > div');
同輩元素選擇器:
function sibilings(el){
//a是 el的同輩元素集合
var a=[];
var p= el.previousSibling;
while (p) {
if(p.nodeType === 1){
a.push(p);
}
p= p.previousSibling;
}
a.reverse();
var n= el.nextSibling;
while (n){
if(n.nodeType === 1){
a.push(n);
}
n= n.nextSibling;
}
return a;
}
brother_elements = sibilings(document.querySelector('target_dom'));
屬性過濾選擇器:
elem = document.querySelector('input[name=testInput]');
其他選擇器:
elem = document.querySelector('input[name=testInput]').nextElementSibling;
querySelectorAll():返回文檔中匹配指定css選擇器的所有元素,返回類型為NodeList。
elem = document.querySelectorAll('div > h1');
返回的是div后直接跟一個(gè)h1標(biāo)簽的所有h1標(biāo)簽元素痒给。
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者