document.querySelector()与document.querySelectorAll()

document.querySelector()与document.querySelectorAll()

CreationTime--2018年7月1日10点49分

Author:Marydon

1.说明

　　他俩是H5提供的选择器，都可以直接获取页面元素并进行操作。

2.区别

　　用法与jQuery里的$()选择器相似；

　　querySelector只能选择第一个匹配的节点；

　　querySelectorAll可以选择多个节点，返回的是数组形式的页面元素对象。

3.举例

window.onload = function(){
    // 获取页面上第一个复选框的值
    // 报错
    //alert(document.querySelectorAll(':checkbox')[0].value);
    // 方式一
    alert(document.querySelectorAll('input[type=checkbox]')[0].value);
    // 方式二
    alert(document.querySelector('input[type=checkbox]').value);
}