《JS高级程序设计》PART6. DOM基础

2011/02/12 读书笔记

1.使用document处理html节点:

hello

假如oP包含指向这个元素的一个引用,则可以这样访问到id属性的值:

var sId = oP.attributes.getNamedItem(“id”).nodeValue;

or 更简单:var sId = op.getAttribute(“id”); //对应的setAttribute(“id”,”newId”);

2.访问指定节点:

· getElementsByTagName():返回一个包含所有tagname特性等于某个指定值的集合:

> > var oImg = document.getElementByTagname("img"); > >

· getElementsByName():通过name来访问控件:

> > red > > > > use:var or = document.getElementByName("redColor"); > > > > alert(var.getAttribute("or"));//"red" > >

· getElementById:通过Id值来访问;这种方法效率更高,因为html中id值唯一;

注:如果给定的ID匹配某个元素的name特性,则IE6.0还会返回这个元素,这是IE6的一个bug!!!

注:DOM操作必须页面完全载入之后才能进行;在页面完全下载到客户端之前,是无法完全构建DOM树的。因此,必须使用onload时间句柄来执行所有的代码。

注:IE6在setAttribute()上有个很大的问题:当使用它时,变更并不会总是正确的反应出来,因此,如果要支持IE,最好尽可能使用属性(HTML DOM特征)来替换:

> > eg: var oImg = document.getElementByName("coolImg"); > > > > oImg.getAttribute("src") ==> oImg.src > > > > oImg.setAttribut("src","mypic2.jpg"); ==> oImg.src = "mypic2.jpg"; > >

使用DOM Level2 遍历DOM(只能在Mozilla等中才有的,IE6不支持):NodeIterator,TreeWalker

测试代码:

> > > > > > > > > > > > > > > > > > > > > >

1111

> > > > > > > > ITyouhui > > > > 这是百度链接,通过document改为Google的 > > > >

222

> > > > > > </blockquote>

Search

    Post Directory