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. java实现压缩文件下载

    转载:https://www.cnblogs.com/zeng1994/p/7862288.html

  2. java课后思考题（四）

    1. 请运行以下示例代码StringPool.java,查看其输出结果.如何解释这样的输出结果?从中你能总结出什么? 输出结果: 结论: 在Java中,内容相同的字串常量(“Hello”)只保存一份以 ...

  3. java——newInstance()方法和new关键字

    https://www.cnblogs.com/liuyanmin/p/5146557.html 这两个都可以创建一个对象,那么这样个东西有什么不一样呢?什么时候用new,什么时候用newInstan ...

  4. java——单例模式

    这个教程写的真好:https://blog.csdn.net/mnb65482/article/details/80458571 1. 什么是单例模式? 单例模式确保某个类只有一个实例. 单例类必须自 ...

  5. java——利用生产者消费者模式思想实现简易版handler机制

    参考教程:http://www.sohu.com/a/237792762_659256 首先说一下这里面涉及到的线程: 1.mainLooper: 这个线程可以理解为消费者线程,里面运行了一个死循环, ...

  6. Windows下VsCode的简单配置

    1. 安装插件 2. 配置终端软件 安装cmder 添加cmder 按下ctrl+shift+p键,输入setting,打开user settings如图: 将  "terminal.int ...

  7. Linux虚拟机无法通过宿主机上网

    解决方法 1.Windows: 确保相关服务已经启动 2.Linux: 确保相关服务已经启动 1) 确认Linux的IP地址和Windows在同一个网段: 若Windows给虚拟机分配的IP地址如下: ...

  8. Django-1 简介

    1.1 MVC与MTV模型 MVCWeb服务器开发领域里著名的MVC模式,所谓MVC就是把Web应用分为模型(M),控制器(C)和视图(V)三层,他们之间以一种插件式的.松耦合的方式连接在一起,模型负 ...

  9. TCP连接的ISN、连接建立超时及TCP的长短连接

    问题现象: 一.TCP连接的ISN         之前我们说过初始建立TCP连接的时候的系列号(ISN)是随机选择的,那么这个系列号为什么不采用一个固定的值呢?主要有两方面的原因 防止同一个连接的不 ...

  10. C#：新邮件监听及搜索

    在项目中,我们需要监听邮件服务器,看是否有新的邮件进入.下面的代码可以帮助我们监听新邮件,并对已有的邮件进行查找: using System; using System.Collections.Gen ...