`

DOM节点类型说明

阅读更多

万维网联盟(W3C)定义HTML DOM 标准节点有以下几种 ()

类型 值 说明  
ELEMENT_NODE  1 元素节点 *
ATTRIBUTE_NODE     2 属性节点 *
TEXT_NODE   3 文本节点 *
CDATA_SECTION_NODE 4 CDATA 区段  
ENTITY_REFERENCE_NODE 5 实体引用  
ENTITY_NODE 6 实体  
PROCESSING_INSTRUCTION_NODE 7 处理指令  
COMMENT_NODE 8 注释节点 *
DOCUMENT_NODE 9 文档节点 *

注: * 表示常用

IE与FF 对 以上节点的 "理解" 有差异,如比我们写js :  对象.nextSibling   ,  来取得对象的下一个兄弟节点,
在IE中,只会取ELEMENT_NODE (元素节点), 忽略其它类型节点.     FF会取得上面各种类型节点.

如:

<table>
  <tr  id="nst"><td></td></tr>(这里有换行,就是一个文本节点)
  <tr><td></td></tr>
</table>
-------------------------------------- 
<js>
var o=$('nst');
var next=o.nextSibling;
</js> 
--------------------------------------- 

 
结果:
IE中:next 是元素节点 (第二个<tr>)
FF中:next 是文本节点 (那个换行)

解决办法: 在base.js中有如下方法:  通过判断 nodeType == 1  来解决问题

 

// 获得下一个元素对象(nodeType=1)
function $NE(e)
{
	e = e.nextSibling;
	while (e && e.nodeType != 1){e = e.nextSibling;}
	return e;
}
// 获得第一个元素对象(nodeType=1)
function $FE(e)
{
	e = e.firstChild;
	while (e && e.nodeType != 1){e = e.nextSibling;}
	return e;
}
分享到:
评论

相关推荐

    js获取HTML DOM节点详解

    - **注意事项**:在 IE7 中,`childNodes` 只包括真正的子节点(即排除了文本节点等),而在 Firefox 2.0.0.11 中则包括所有类型的子节点。 4. **`parentObj.children`** - **说明**:获取指定父节点的所有直接子...

    Javascript入门学习第八篇 js dom节点属性说明第1/2页

    学习DOM节点的各种属性对于我们深入理解DOM结构,以及使用JavaScript来操作页面具有重要意义。 首先,我们来看一下DOM节点的重要属性之一:nodeName。顾名思义,nodeName属性代表的是节点的名字。对于元素节点而言...

    dojo1.6关于DOM相关操作的官方介绍

    3. **dojo.byId**: 这个函数是获取DOM节点的简单方式,它接受一个ID作为参数,返回匹配该ID的DOM节点。等同于JavaScript的`document.getElementById`。 4. **dojo.place**: 此函数用于在DOM树中插入新的元素。它...

    Dom4J使用手册和说明

    DOM(文档对象模型)是一种与平台和语言无关的接口,允许程序和脚本动态地访问和更新文档的内容、结构和类型。W3C(万维网联盟)制定了DOM规范,使XML文档能够被不同的语言编程接口所使用。而SAX(简单API for XML)...

    DOM.rar_DOM_HTML dom_dom树解析

    DOM的核心在于将文档结构化为一个节点树,每个节点代表文档的一部分,如元素、文本、注释等。 在HTML DOM中,每个HTML元素都是一个对象,这些对象形成了一个层次结构,即DOM树。**DOM树解析**是将HTML或XML文档转换...

    domelementtype:htmlparser2 dom中所有类型的节点

    本篇文章将深入探讨HTMLParser2中的DOM节点类型,并结合TypeScript的相关特性进行详细说明。 DOM(Document Object Model)是W3C组织定义的一种标准,用于表示HTML或XML文档的树形结构。在HTMLParser2中,DOM节点...

    DOM文档对象模型

    2. **节点类型**:DOM定义了几种主要的节点类型,包括元素节点(Element Node)、文本节点(Text Node)、属性节点(Attribute Node)、文档节点(Document Node)等。元素节点表示HTML或XML的标签,文本节点包含...

    dom4j使用简介

    - **org.dom4j.CharacterData**:标识基于字符的节点类型。 - **org.dom4j.CDATA**:表示CDATA区域。 - **org.dom4j.Comment**:表示XML注释。 - **org.dom4j.Text**:表示XML文本节点。 - **org.dom4j....

    Dom4j使用简介 帮助文档

    它是所有节点类型的父接口。 13. **`NodeFilter`**:定义了在 dom4j 节点中产生的过滤器或谓词的行为。这在查询特定类型的节点时非常有用。 14. **`ProcessingInstruction`**:定义了 XML 处理指令。这些指令通常...

    dom4j解析xml例子

    这个“dom4j解析xml例子”压缩包应该包含了一些示例代码、帮助文档和使用说明,旨在帮助初学者快速理解和应用DOM4J。 在XML解析领域,DOM(Document Object Model)是一种将XML文档转换为内存对象树的方法。DOM4J是...

    js DOM模型操作

    DOM模型中的节点:元素节点、文本节点、属性节点 例:私のdotnet小屋&lt;/a&gt; (1)a是元素节点 (2)“私のdotnet小屋”是文本节点 (3)href=”http://www.cnblogs.com/shuz”是属性节点 DOM节点的属性 属性 类型...

    虚拟dom1

    - 创建虚拟DOM节点,包括属性和子节点。 - 使用diff算法比较新旧虚拟DOM树,找出差异。 - 应用diff结果到实际DOM,更新界面。 **7. 小结** 虚拟DOM通过抽象和优化DOM操作,提高了前端应用的性能和开发效率。Vue.js...

    DOM4J 使用简介.pdf

    这是DOM4J中所有节点类型的父接口。 13. **`NodeFilter`** - 定义了在DOM4J节点中产生的一个滤镜或谓词的行为。这个接口用于过滤或选择特定的节点。 14. **`ProcessingInstruction`** - 定义XML处理指令。处理...

    Gecko DOM Reference

    - **重要数据类型**:列举了一些重要的DOM数据类型,如Node、Element、Text等,并简要说明了它们的作用。 #### 五、DOM 接口 - **DOM Interfaces**:这一部分详细列出了DOM支持的各种接口,例如`Element`、`...

    HTML DOM 文档

    在这个帮助文档中,我们可以找到关于DOM的各种详细信息,包括基本概念、节点类型、选择和操作元素的方法,以及一些实用的例子。 1. **DOM定义与作用** - DOM是HTML和XML文档的结构化表示,它将文档视为一棵由节点...

    Android应用源码之28.使用DOM和pull解析XML.zip

    3. **XPath**:用于在DOM树中查找特定节点的语言,可以根据路径快速定位到所需节点。 使用DOM解析XML的基本步骤如下: 1. 加载XML文件:使用`DocumentBuilderFactory`创建`DocumentBuilder`,然后调用`parse()`方法...

    DOM+JavaScript+ jq+html手册.rar

    DOM(Document Object Model)是HTML和XML文档的标准表示方式,它将文档结构化为一个节点树,使得开发者可以通过JavaScript或其他脚本语言操作文档的各个部分。DOM提供了添加、删除、修改页面元素的能力,是实现网页...

    XMLDOM对象方法手册

    Node对象拥有`nodeName`(节点名)、`nodeValue`(节点值)、`nodeType`(节点类型)等属性,以及`appendChild()`(添加子节点)、`removeChild()`(移除子节点)等方法。 3. **Element对象**:代表XML文档中的元素...

    AJAX开发简略 DOM文档对象中文手册

    1. **节点类型**:DOM中的节点分为元素节点、属性节点、文本节点等,每种节点都有特定的属性和方法。 2. **节点操作**:通过DOM,我们可以创建、访问、修改和删除HTML元素。例如,通过`document.getElementById()`...

Global site tag (gtag.js) - Google Analytics