zoukankan      html  css  js  c++  java
  • DOM编程艺术 4

     <div id="header" title="this is test title">
         first child node
         <br />
         second child node
    <p>this is footer</p>
    </div> <div id="content">content .....</div> <div id="footer">footer</div>

    1.获得所有的div对象

    var div = document.getElementsByTagName("div");

    2.获得header节点

    var header = document.getElementsByTagName("div")[0];

    或者

    var header = document.getElementById("header");

    3.header节点对象的常用属性(childNodes、nodeType、nodeValue、firstChild、lastChild)

    4.childNodes  //检索元素的所有子节点

    header.childNodes.length  //return 5

    header.childNodes[0]    //return first child node    文本节点

    header.childNodes[1]    //return <br />        元素节点         

    header.childNodes[2]    //return second child node   文本节点

    header.childNodes[3]    //return <p>this is footer</p>  元素节点

    header.childNodes[4]    //return Text对象

    节点的三种类型:文本节点、元素节点、属性节点

    nodeTyoe来判断节点类型;

    元素节点的nodeTyoe属性值是1;

    属性节点的nodeTyoe属性值是2;

    文本节点的nodeTyoe属性值是3;

    5.获得footer节点的文本值

    var footer = document.getElementById("footer");

    footer.nodeValue  //return null

    为什么?

    因为此元素里的文本是另一种节点,它在DOM里是元素的第一个子节点,也就是说,要获得footer的文本值,就必须检索它的第一个子节点的nodeValue属性值。

    footer.childNodes[0].nodeValue  //footer

    footer.childNodes[0] == footer.firstChild  //return true;

    好了,今天先到这里吧^O^

  • 相关阅读:
    java 继承(下)
    java继承
    java代码封装与编译
    使用Access-Control-Allow-Origin解决跨域
    java (基本语法)
    ZendStudio如何汉化
    如何让数据库在每天的某一个时刻自动执行某一个存储过程或者某一个sql语句
    百度地图不用密匙也可以使用
    .net在当前日期的基础上加一天
    当你的IIS需要运行ASP网站时,需要这样配置下你的IIS
  • 原文地址:https://www.cnblogs.com/daxian2012/p/2613568.html
Copyright © 2011-2022 走看看