原生javascript选择器

javascript常用的选择器有getElementById() getElementsByName() getElementsByTagName() getElementsByClassName() querySelector() querySelectorAll()

getElementById('id') ：返回对指定ID的第一个对象的引用。

---

getElementsByName('name')：返回文档中name属性为name值的元素，因为name属性值不是唯一的，
所以查询到的结果有可能返回的是一个数组，而不是一个元素。

---

getElementsByTagName('tagname')：返回文档中指定标签的元素。

---

getElementsByClassName('className')：返回文档中所有类名为className的元素。

---

querySelector(selector)：返回文档中匹配指定css选择器的第一个元素。
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后直接跟一个h1标签的所有h1标签元素。

---