1.Node对象属性一
            * nodeName
            * nodeType
            * nodeValue

* 使用dom解析html时候，需要html里面的标签，属性和文本都封装成对象

<body>

    <span id="spanid">哈哈呵呵</span>

    <script type="text/javascript">

        //获取标签对象

        var span1 = document.getElementById("spanid");

        //alert(span1.nodeType);   //  1

        ///alert(span1.nodeName);   // SPAN

        ///alert(span1.nodeValue);  // null

        //获取属性对象

        var id1 = span1.getAttributeNode("id");

        //alert(id1.nodeType);  // 2

        //alert(id1.nodeName);  // id

        //alert(id1.nodeValue); // spanid

        //获取文本

        var text1 = span1.firstChild;

        alert(text1.nodeType);  //  3

        alert(text1.nodeName);  // #text

        alert(text1.nodeValue); // 内容

    </script>

 </body>

* 标签节点对应的值
                       nodeType： 1
                       nodeName： 大写标签名称 比如SPAN
                       nodeValue: null
            * 属性节点对应的值
                       nodeType： 2
                       nodeName： 属性名称
                       nodeValue: 属性的值
            * 文本节点对应的值
                       nodeType： 3
                       nodeName： #text
                       nodeValue: 文本内容

2.Node对象的属性二
           <ul>
                   <li>qqqqq</li>
                   <li>wwww</li>
          </ul>

* 父节点
                     - ul是li的父节点
                     - parentNode
                     - //得到li1
                    var li1 = document.getElementById("li1");
                      //得到ul
                       var ul1 = li1.parentNode;
                      alert(ul1.id);

* 子节点
                    - li是ul的子节点
                    - childNodes：得到所有子节点，但是兼容性很差

- firstChild：获取第一个子节点
                              - //获取ul的第一个子节点 id=li1
                               //得到ul
                               var ul1 = document.getElementById("ulid");
                               //第一个子节点
                               var li1 = ul1.firstChild;
                               alert(li1.id);
                    - lastChild：获取最后一个子节点
                               //得到最后一个子节点
                               var li4 = ul1.lastChild;
                               alert(li4.id);

* 同辈节点
                    - li直接关系是同辈节点
                    - nextSibling: 返回一个给定节点的下一个兄弟节点。
                      previousSibling：返回一个给定节点的上一个兄弟节点。

- //获取li的id是li3的上一个和下一个兄弟节点
                                 var li3 = document.getElementById("li3");
                                //alert(li3.nextSibling.id);
                                 alert(li3.previousSibling.id);

 <body>

    <ul id="ulid">

        <li id="li1" value="qqq">qqqqq</li>

        <li id="li2">wwww</li>

        <li id="li3">yyyyyy</li>

        <li id="li4">test1111</li>

    </ul>

    <script type="text/javascript">

        //得到li1

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

        //得到ul

        var ul1 = li1.parentNode;

    //    alert(ul1.id);

        //获取ul的第一个子节点 id=li1

        //得到ul

        var ul1 = document.getElementById("ulid");

        //第一个子节点

        var li1 = ul1.firstChild;

        //alert(li1.id);

        //得到最后一个子节点

        var li4 = ul1.lastChild;

        //alert(li4.id);

        //获取li的id是li3的上一个和下一个兄弟节点

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

        alert(li3.nextSibling.id);

        alert(li3.previousSibling.id);

    </script>

 </body>

Node对象属性的更多相关文章

  1. getSelection、range 对象属性，方法理解，解释

    网上转了一圈发现没有selection方面的解释,自己捣鼓下 以这段文字为例子.. <p><b>法国国营铁路公司(SNCF)20日承认,</b>新订购的2000列火 ...

  2. JavaScript基础10——node对象

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. xml 转换成对象(采用反射机制对对对象属性赋值)

    /// <summary> /// 采用反射机制对对对象属性赋值 /// </summary> /// <param name="node">& ...

  4. DOM对象属性(property)与HTML标签特性(attribute)

    HTML中property与attribute是极易混淆的两个概念.大多数时候这两个单词都翻译为"属性",为了区分二者,一般将property翻译为"属性",a ...

  5. DOM基础知识（Node对象、Element对象）

    5.Node对象 u  遍历节点 u 父节点 .parentNode - 获取父节点—> 元素节点或文档节点 .parentElement - 获取父元素节点—> 元素节点 u    子节 ...

  6. Node对象的一些方法

    Node对象是什么提供了 DOM的标准规范提供了Node对象,该对象主要提供了解析DOM节点树结构的属性和方法,DOM树结构主要是依靠节点进行解析,称为DOM节点树结构.Node对象是解析DOM节点树 ...

  7. 探究@property申明对象属性时copy与strong的区别

    一.问题来源 一直没有搞清楚NSString.NSArray.NSDictionary--属性描述关键字copy和strong的区别,看别人的项目中属性定义有的用copy,有的用strong.自己在开 ...

  8. [源码]Literacy 快速反射读写对象属性,字段

    Literacy 说明 Literacy使用IL指令生成方法委托,性能方面,在调用次数达到一定量的时候比反射高很多 当然,用IL指令生成一个方法也是有时间消耗的,所以在只使用一次或少数几次的情况,不但 ...

  9. 了解JavaScript 对象属性的标签

    对象属性的标签 value(属性值), writable(属性可写), enumerable(属性可枚举), configurable(属性可配置), 这些属性标签使对象所持有的属性体现出不同的特性, ...

随机推荐

  1. Linux命令:修改文件权限命令chmod、chgrp、chown详解

    Linux系统中的每个文件和目录都有访问许可权限,用它来确定谁可以通过何种方式对文件和目录进行访问和操作. 文件或目录的访问权 限分为只读,只写和可执行三种.以文件为例,只读权限表示只允许读其内容,而 ...

  2. VI,CI,UI

    一.VI VI全称Visual Identity, 即企业VI视觉设计,通译为视觉识别系统.是将CI的非可视内容转化为静态的视觉识别符号.设计到位.实施科学的视觉识别系统,是传播企业经营理念.建立企业 ...

  3. 一些免费收费api收藏

    转载:http://blog.csdn.net/sdjianfei/article/details/53157334 一 .api 1.http://apistore.baidu.com/astore ...

  4. Noip2016のmengbier

    Day0 上午10点多上了火车,向三位学长问了一路去年noip他们是用什么心态去考的,明明老师和同学都说我正常发挥应该没什么问题但心里就是紧张的不行,就是害怕犯个sb错误爆上一道题TAT. 去试机.. ...

  5. js-FCC算法-Pairwise

    找到你的另一半 都说优秀的程序员擅长面向对象编程,但却经常找不到另一半,这是为什么呢?因为你总是把自己局限成为一个程序员,没有打开自己的思维. 这是一个社群的时代啊,在这里你应该找到与你有相同价值观但 ...

  6. ubuntu14.04 配置中文输入法

    ubuntu14.04自带中文输入法,只要配置就可以了. 1.安装中文支持 System Settings -->  Language Support 点击 install/remove lan ...

  7. 验证时出错。HRESULT = '8000000A'

    往往出现在 做了安装项目后有警告: 解决办法: 这本来是在VS2005下创建的一下项目,后来改用VS2010的开发环境,.NET Framework的版本还是使用2.0, 但每次生成之后都会在解决方案 ...

  8. Google Guava vs Apache Commons for Argument Validation

    It is an established good practice to validate method arguments at the beginning of the method body. ...

  9. Socket与SocketServer结合多线程实现多客户端与服务器通信

    需求说明:实现多客户端用户登录,实现多客户端登录一般都需要使用线程技术: (1)创建服务器端线程类,run()方法中实现对一个请求的响应处理: (2)修改服务器端代码,实现循环监听状态: (3)服务器 ...

  10. Default团队项目立题

    PhyLab物理实验网站 接手PhyLab网站,进一步优化网站体验,增加新的功能.