您的位置：首页 > Web前端 > JavaScript

JavaScript之DOM-3 选取元素(通过 HTML 选取元素、通过 CSS选取元素、其他选取)

2016-03-31 19:02 633 查看

一、通过 HTML 选取元素

通过 ID 选取元素
- document.getElementById('id')可用于在当前DOM树中根据ID选取某一个子元素

通过标签名选取元素 - node.getElementsByTagName('标签名')可以根据标签名返回所有具有指定标签名的元素集合

通过 name 属性选取元素 - document.getElementByName('name属性')可以返回DOM数中具有指定name属性值的所有子元素集合

二、通过 CSS 选取元素
通过 CSS 选取元素 - HTML5 中新添了一个可以根据class名称选取元素的方法: node.getElementsByClassName('className'); //IE9+、Firefox3+、Safari3.1+、Chrome、Opera9.5+

通过 CSS 选择器选取元素 - HTML5 还定义了如下两个可以根据 CSS 选择器来选取元素的方法: - node.querySelector('selector'); //返回第一个匹配的 - node.querySelectorAll('selector');//返回全部匹配的

三、其他选取
document.all - document.all 是一个类数组对象，是页面中所有元素的一个集合，具体用法: - document.all[index] - document.all['id'] - document.all.id
- document.all['name']
- document.all.tags['tagName']

document.documentElement
- document.documentElement 对象是整个HTML文档的根元素(即<html>元素)的引用 - document.documentElement === document.lastChild
document.head - document.head 对象是 HTML 文档中<head>元素的引用 - document.head === document.lastChild.firstChild
document.body - document.body 对象是 HTML 文档中 <body>元素的引用 - document.head === document.lastChild.lastChild

总结：本章内容主要介绍了 JavaScript DOM 选取元素(通过 HTML 选取元素、通过 CSS选取元素、其他选取)

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 标签元素 Chrome HTML5 中新

相关文章推荐

新的分享

章节导航