Node类型
DOM1级定义了一个Node接口，该接口将由DOM中的所有节点类型实现，每个节点都有一个nodeType属性，用于表明节点的类型。节点类型由在Node
类型中定义的下列12个数值常量来表示，任何节点类型必居其一：

元素节点 　　Node.ELEMENT_NODE(1)

属性节点 　　Node.ATTRIBUTE_NODE(2)

文本节点 　　Node.TEXT_NODE(3)

CDATA节点 Node.CDATA_SECTION_NODE(4)

实体引用名称节点 　　 Node.ENTRY_REFERENCE_NODE(5)

实体名称节点 　　Node.ENTITY_NODE(6)

处理指令节点 　　Node.PROCESSING_INSTRUCTION_NODE(7)

注释节点 　 Node.COMMENT_NODE(8)

文档节点 　 Node.DOCUMENT_NODE(9)

文档类型节点 　　Node.DOCUMENT_TYPE_NODE(10)

文档片段节点 　　Node.DOCUMENT_FRAGMENT_NODE(11)

DTD声明节点 Node.NOTATION_NODE(12)

为了确保跨浏览器兼容，最好还是将nodeType属性与数字值进行比较

if(someNode.nodeType == 1){

    console.log('node is an element.');

    value = someNode.nodeName;

}

nodeName中保存的始终都是元素的标签名，而nodeValue的值则始终为null。在使用这两个值以前，最好是像上面这样先检测一下节点的类型

NodeList
每个节点都有一个childNodes属性，其中保存着一个NodeList对象，NodeList对象是一种类数组对象，用于保存一组有序的点，可以通过位置来访问
这些节点。NodeList对象是自动变化的

<!DOCTYPE html>

<html>

    <head>

        <title>sample page</title>

    </head>

    <body>

        <p>Hello World!</p>

    </body>

</html>    
var firstChild = $(html).childNodes[0];

var secondChild = $(html).childNodes.item(1);

var count = $(html).childNodes.length;

无论使用方括号还是使用item()方法都没有问题，length属性表示都是访问nodelist都那一刻，其中包涵的节点数量

将NodeList对象转化为数组

function converToArray (nodes) {

    var arrary = null;

    try {

        array = Array.prototype.slice.call(nodes,0); //在ie8及之前版本中无效，需要手动创建数组

    }catch (ex) {

        array = new Array();

        for (var i=0,len=nodes.length ; i<len ; i++) {

            array.push(nodes[i]);

        }

    }

    return array;

}

检测是第一个节点还是最后一个
每个节点都有一个parentNode属性，该属性指向文档树中的父节点。
包含在childNodes列表中的每个节点相互之间都是同胞节点，previousSibling(上一个同胞节点),nextSibling(下一个同胞节点)

if(someNode.nextSibling === null){

    console.log('last node'); //最后一个节点

}else if(someNode.previousSibling === null){

    console.log('first node'); //第一个节点

}

如果列表只有一个节点，那么该节点的nextSibing和previousSibling都为null.

DOM(一)：节点层次－Node类型的更多相关文章

  1. JavaScript中DOM节点层次Text类型

    文本节点 标签之间只要有一点内容都会有文本节点,包括空格 创建文本节点document.createTextNode() 可以使用 document.createTextNode 创建新文本节点 == ...

  2. DOM之节点层次

    1.1 Node类型 DOM1级定义了一个Node接口,该接口将由DOM中的所有节点类型实现.这个Node接口在JS中是作为Node类型实现的:除了IE之外,其他浏览器可访问这个类型.JS中的所有节点 ...

  3. DOM_节点层次_Element类型

    一.Element类型: nodeType: 1; nodeName: 元素名; nodeValue: null; parentValue: Document 或者 Element; var oDiv ...

  4. DOM_节点层次_Document类型

    一.Document类型 nodeType: 9; nodeName: "#document"; nodeValue: null; parentValue: null; owner ...

  5. javascript DOM中的节点层次和节点类型概述

    针对JS高级程序设计这本书,主要是理解概念,大部分要点源自书内.写这个主要是当个笔记加总结 存在的问题请大家多多指正! 因为DOM这方面的对象方法操作性都特别强,但是逻辑很简单,所以就没有涉及到实际的 ...

  6. js文本对象模型[DOM]【续】(Node节点类型)

    一.Document类型    document实例1.常用的一些属性documentElement 始终指向HTML页面中的<html>元素.body 直接指向<body>元 ...

  7. JS基础DOM篇之二：ＤＯＭ级别与节点层次？

    通过上一篇我们大致了解了什么是DOM,今天我们继续深入了解. 1.DOM级别       在大家阅读DOM标准的时候,可能会看到DOM(0/1/2/3)级的字眼,这就是DOM级别.但实际上,DOM0级 ...

  8. 《JAVASCRIPT高级程序设计》节点层次和DOM操作技术

    DOM可以将任何HTML和XML文档描绘成一个由多层次节点构成的结构.节点分为几种不同的类型,每种类型分别表示文档中不同的信息,每种类型都继承与Node接口,因此都共同享有一些属性和方法,同时,也拥有 ...

  9. 从原型链看DOM－－Node类型

    前言: 本系列从原型,原型链,属性类型等方面下手学习了DOM文档对象模型,旨在弄清我们在DOM中常用的每一个属性和方法都清楚它从哪里来要到哪里做什么事,这样对于理解代码有一定启发.全靠自己在总结中摸索 ...

随机推荐

  1. VMware硬盘空间——扩容

    VMware原来分配的硬盘空间太小了--扩容 找到VMware的安装路径,如我是默认安装的:C:\Program Files (x86)\VMware\VMware Workstation,打开该路径 ...

  2. python发送微信

    申请企业微信 使用python发送信息到企业微信,同时支持python2与python3环境,需要先申请一个企业微信,然后创建应用,获取以下三个信息 企业IP.Agentid.Secret 网信为创建 ...

  3. docker 命令详解（cp篇）

    docker cp :用于容器与主机之间的数据拷贝. 1.从容器里面拷文件到宿主机 答:在宿主机里面执行以下命令 docker cp 容器名:要拷贝的文件在容器里面的路径   要拷贝到宿主机的相应路径 ...

  4. Postman如何做接口测试

    Postman 之前是作为Chrome 的一个插件,现在要下载应用才能使用. 以下是postman 的界面: 各个功能区的使用如下: 快捷区: 快捷区提供常用的操作入口,包括运行收藏夹的一组测试数据, ...

  5. 加解密---Base64

    1.算法实现: 1.1 JDK提供: package com.exiuge.mytest; import sun.misc.BASE64Decoder; import sun.misc.BASE64E ...

  6. 更换 npm 源国内镜像 cnpm

    默认镜像源 https://www.npmjs.com/ 临时改变镜像源 方法一:通过config配置指向国内镜像源 npm config set registry http://registry.c ...

  7. kafka与zookeeper读写分析

    kafka的读写都通过leader完成,而zookeeper只有写要通过leader而读可以通过任意follower,我觉得造成这种差异的原因还是在于使用场景. kafka的设计目标是实现一个高吞吐的 ...

  8. Java基础03-类型转换

    1.自动转换 int->double char->String 例:double a=10; 2.强制类型转换 (类型名)表达式 注意:String不能强制转化为char public c ...

  9. Murano Weekly Meeting 2016.07.19

    Meeting time: 2016.July.19 1:00~2:00 Chairperson:  Kirill Zaitsev, from Mirantis Meeting summary: 1. ...

  10. SQL DATEDIFF语法及时间函数 Sql 查询当天、本周、本月记录

    SQL DATEDIFF语法及时间函数 Sql 查询当天.本周.本月记录 转:http://blog.csdn.net/Json1204/article/details/7863801?locatio ...