DOM — 标准的DOM方法

前端技术 everyinch 1267℃ 0评论

所有的现代DOM实现都包含从一系列方法,让遍历DOM可以是一种平滑的体验。JavaScript DOM实现包含两个强大的方法:
getElementById(“everywhere”):查找id是everywhere的元素
getElementsByTagName(“li”):该方法能运行于任何元素下,找出该元素下的所有标签名为 li 的后代元素,并返回 NodeList(节点列表)
例子:

//返回文档中的第一个<h1>元素:
document.getElementsByTagName("h1")[0]
//获取所有的<li>元素并为之加上边框
var li = document.getElementsByTagName("li");
for ( var j = 0; j < li.length; j++ ) {
    li&#91;j&#93;.style.border = "1px solid #000";
}
&#91;/code&#93;
&#91;code lang="js"&#93;
//使 'everywhere' 元素的文本加粗
document.getElementById("everywhere").style.fontWeight = 'bold';
&#91;/code&#93;
为了弥补冗长的代码,可以封装两个函数:

&#91;code lang="js"&#93;
function id(name) {
    return document.getElementById(name);
}

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


转载请注明:陈童的博客 » DOM — 标准的DOM方法

喜欢 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

无觅相关文章插件,快速提升流量