陈童的博客 » Archivers » 前端技术 » DOM — 标准的DOM方法

From everyinch on 2013-11-25 07:35:58

DOM — 标准的DOM方法

所有的现代DOM实现都包含从一系列方法，让遍历DOM可以是一种平滑的体验。JavaScript DOM实现包含两个强大的方法：
getElementById(“everywhere”)：查找id是everywhere的元素
getElementsByTagName(“li”)：该方法能运行于任何元素下，找出该元素下的所有标签名为 li 的后代元素，并返回 NodeList（节点列表）
例子：
[code lang="js"]
//返回文档中的第一个元素：
document.getElementsByTagName("h1")[0]
[/code]
[code lang="js"]
//获取所有的

元素并为之加上边框
var li = document.getElementsByTagName("li");
for ( var j = 0; j < li.length; j++ ) {
li[j].style.border = "1px solid #000";
}
[/code]
[code lang="js"]
//使 'everywhere' 元素的文本加粗
document.getElementById("everywhere").style.fontWeight = 'bold';
[/code]
为了弥补冗长的代码，可以封装两个函数：

[code lang="js"]
function id(name) {
return document.getElementById(name);
}

function tag(name, elem) {
return (elem || document).getElementsByTagName(name);
}
[/code]
例子：
[code lang="js"]
//返回文档中的第一个元素：
next(tag("h1")[0]);
[/code]

查看完整版本： DOM — 标准的DOM方法

Tags:

查看完整版本： DOM — 标准的DOM方法