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级别与节点层次?

    通过上一篇我们大致了解了什么是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——多线程的实现方式、三种办法解决线程赛跑、多线程数据同步(synchronized)、死锁

    多线程的实现方式:demo1.demo2 demo1:继承Thread类,重写run()方法 package thread_test; public class ThreadDemo1 extends ...

  2. vector 中需要注意的东西!

    vector的erase方法注意点!!! C++11是这样的: iterator erase (const_iterator position); iterator erase (const_iter ...

  3. SCAU 算法课的题

    8594 有重复元素的排列问题(优先做) 时间限制:1000MS  内存限制:1000K提交次数:1610 通过次数:656 题型: 编程题   语言: G++;GCC;VC Description ...

  4. [转]Knockoutjs快速入门

    本文转自:http://www.cnblogs.com/yinzixin/archive/2012/12/21/2827356.html Knockoutjs是一个JavaScript实现的MVVM框 ...

  5. Murano Weekly Meeting 2015.09.01

    Meeting time: 2015.September.1st 1:00~2:00 Chairperson:  Nikolay Starodubtsev, from Mirantis Meeting ...

  6. 硬盘和显卡的访问与控制(一)——《x86汇编语言:从实模式到保护模式》读书笔记01

    本文是<x86汇编语言:从实模式到保护模式>(电子工业出版社)的读书实验笔记. 这篇文章我们先不分析代码,而是说一下在Bochs环境下如何看到实验结果. 需要的源码文件 第一个文件是加载程 ...

  7. 常见的25个顶级PHP模板引擎

    为了找到一个好的模板引擎,我在互联网上进行搜索,目前已经整理出了以下名单: SmartySmarty的特点是将模板编译成PHP脚本,然后执行这些脚本.很快,非常灵活. Heyes Template C ...

  8. tck/tl 以及expect脚本

    最近有用到,利用expcet脚本自动登录到远程服务器并提权执行脚本. 搜集的知识如下: tcl/tk参考——列表操作lindex expect脚本解释 代码如下 #!/usr/bin/expect - ...

  9. 深入理解.net remoting 与webservice

    1. .NET Remoting .NET Remoting是微软随.NET推出的一种分布式应用解决方案,被誉为管理应用程序域之间的 RPC 的首选技,它允许不同应用程序域之间进行通信(这里的通信可以 ...

  10. NLog学习笔记二:深入学习

    配置文件 NLog所有的配置信息都可以写到一个单独的xml文件中,也可以在程序代码中进行配置. 配置文件位置 启动的时候,NLog会试图查找配置文件完成自动配置,查找的文件依次如下(找到配置信息则结束 ...