整个文档的节点就是 document 节点, 那么想要具体找到某个节点, 我们可以使用 document 提供的一系列方法:
图片发自简书 App
getElementsByTagName()返回所有指定 html 标签的元素, 返回值是一个类似数组的 HTMLCollection 对象; 匹配失败, 返回 [] 参数是想要获取节点的具体节点名称, 就是标签名;
图片发自简书 App
getElementsByClassName()返回所有 class 名字符合指定条件的元素, 返回值是一个类似数组的 HTMLCollection 对象; 匹配失败, 返回 [] 参数为标签的 class 属性的值
图片发自简书 App
getElementsByName()选择拥有 name 属性的 HTML 元素, 返回值是一个类似数组的 HTMLCollection 对象; 匹配失败, 返回 [] 参数为标签的 name 属性的值; 注意, 使用时, 最好选择原生具有 name 属性的元素;
图片发自简书 App
getElementById()返回匹配指定 id 属性的元素节点; 没有发现匹配的节点, 则返回 null 参数为标签的 id 属性的值, 参数大小写敏感;
图片发自简书 App
querySelector(),querySelectorAll()document.querySelector 方法接受一个 CSS 选择器作为参数, 返回匹配该
选择器的元素节点; 如果有多个节点满足匹配条件, 则返回第一个匹配的节点. 如果没有发现匹配的节点, 则返回
null;
document.querySelectorAll 方法与 querySelector 用法类似, 区别是返回一个类似数组的 HTMLCollection 对象,
包含所有匹配给定选择器的节点.
来源: http://www.jianshu.com/p/1c877e8a67c5