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. 关于Android中图片大小、内存占用与drawable文件夹关系的研究与分析

    原文:关于Android中图片大小.内存占用与drawable文件夹关系的研究与分析 相关: Android drawable微技巧,你所不知道的drawable的那些细节 经常会有朋友问我这个问题: ...

  2. 数据库开发基础-SQl Server 主键、外键、子查询(嵌套查询)

    主键 数据库主键是指表中一个列或列的组合,其值能唯一地标识表中的每一行.这样的一列或多列称为表的主键,通过它可强制表的实体完整性.当创建或更改表时可通过定义 PRIMARY KEY约束来创建主键.一个 ...

  3. R语言之RCurl实现文件批量下载

    前言: RCurl工具包的作者是由Duncan Temple Lang现任加州大学 U.C. Davis分校副教授.他曾致力于借助统计整合进行信息技术的探索.使用者通过RCurl可以轻易访问网页,进行 ...

  4. NOI WC2016滚粗记

    Day-4 报到日,今年居然没有发包QAQ,中午到的,志愿者很热情,食堂吃不了(也有可能是吃不惯),空调打不热,有拖线板(好评),有wifi覆盖(虽然听说连上要看脸)(反正我是没连过,用的自己的流量) ...

  5. Leetcode 264. Ugly Number II

    Write a program to find the n-th ugly number. Ugly numbers are positive numbers whose prime factors ...

  6. 公司内多个公众号实现账号互通(UnionID机制处理)

    场景: 由于用户在每个公众号上的OpenID都不一样,如果要实现判断判断某个用户在其中一个公众号上已经绑定过,那么就要借助(UnionID机制)的机制. 条件: 1.拥有微信开放平台账号,且认证(ht ...

  7. 硬盘分区时GPT和MBR的区别/选择

    最明显的区别是MBR最大支持2T的硬盘,而GPT则更大. 1.最先出现在Windows8中设置新磁盘,系统会询问你是想要使用MBR还是GPT分区,GPT是一种新的硬盘分区标准.GPT带来了很多新特性, ...

  8. ueditor的优酷插件模式开发,目前开发了腾讯视频转换插件

    项目相关地址 源码:https://github.com/easonjim/ueditor_plugin bug提交:https://github.com/easonjim/ueditor_plugi ...

  9. Bzoj4300 绝世好题

    Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 1325  Solved: 722 Description 给定一个长度为n的数列ai,求ai的子序列bi ...

  10. 开发新产品的三个验证阶段(EVT/DVT/PVT)

    1.EVT, Engineering Validation Test 是针对工程原型机的验证,对象很可能是一大块开发板,或是很多块开发板:关键是要有足够时间和样品. 通常,如果是新平台,需要花的时间和 ...