`
jyren_Rachel
  • 浏览: 5165 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

JavaScript Dom信息

 
阅读更多

Dom节点的信息

nodeName:节点的名字,返回字符串

 

  • 元素节点,返回这个元素的名字,相当于tagName属性,如p
  • 属性节点,返回这个属性的名字
  • 文本节点,返回一个#text的字符串

nodeType: 节点的类型,返回整数

常用的三种类型:

  • nodeType == 1 : 元素节点 ,<p>,<h1>
  • nodeType == 2 : 属性节点,title="cssrain"
  • nodeType == 3 : 文本节点<p>test</p>test就是文本节点

 

整数 常量
1 ELEMENT_NODE,普通元素节点,如<html>,<p>,<div>,<span>,<img>
2 ATTRIBUTE_NODE,元素属性
3 TEXT_NODE,文本节点
4 CDATA_SECTION_NODE,即<![CDATA[ ]]>
5 ENTITY_REFERENCE_NODE,实体引用,如&amp;&nbsp;
6 ENTITY_NODE,实体,如<!ENTITY copyright “Copyright 2010, impng. All rights reserved”]>
7 PROCESSING_INSTRUCTION_NODE,PI,处理指令,如<?xml  version=”1.0″?>
8 COMMENT_NODE,注释<!–   –>
9 DOCUMENT_NODE,根节点,即document.nodeType
10 DOCUMENT_TYPE_NODE,DTD,文档类型<!DOCTYPE   >
11 DOCUMENT_FRAGMENT_NODE,文档片段
12 NOTATION_NODE,DTD中定义的记号

 

nodeValue:节点的值,返回字符串

  • 元素节点,返回null
  • 属性节点,这个属性的值
  • 文本节点,这个文本节点的内容

nodeValue是一个可以读,可以写的属性,但不能设置元素节点的值

<div id="c">aaaaaaaaaaaaaaaa</div> 
<SCRIPT LANGUAGE="JavaScript"> 
var c= document.getElementById("c"); 
alert( c.nodeValue );//返回null 
</SCRIPT> 
<div id="c">aaaaaaaaaaaaaaaa</div> 
<SCRIPT LANGUAGE="JavaScript"> 
var c= document.getElementById("c"); 
c.nodeValue =" dddddddddddd"; //不能设置 
//alert( c.firstChild.nodeValue ) //元素节点 包括属性节点和文本节点。 
c.firstChild.nodeValue = "test"//能设置 
</SCRIPT> 

  

为确保可以正确运行,可以用如下的方法

<div id="c">aaaaaaaaaaaaaaaa</div> 
<SCRIPT LANGUAGE="JavaScript"> 
var c= document.getElementById("c"); 
c.nodeValue =" dddddddddddd"; //不能设置 
//alert( c.firstChild.nodeValue ) 
if( c.firstChild.nodeType==3 ){ //判断是不是 文本节点 
c.firstChild.nodeValue = "test"//能设置 
} 
</SCRIPT> 

 所以如要要设置属性节点,不能直接设置,需要先使用firstChild或者lastChild等,然后设置nodeValue.

nodeValue一般只用来设置文本节点的值,如果要刷新属性节点的值,一般使用setAttribute();

 

分享到:
评论

相关推荐

    JavaScript dom操作 dom元素查询 示例代码

    JavaScript dom操作 dom元素查询 示例代码JavaScript dom操作 dom元素查询 示例代码JavaScript dom操作 dom元素查询 示例代码JavaScript dom操作 dom元素查询 示例代码JavaScript dom操作 dom元素查询 示例代码...

    JavaScript DOM编程艺术【第2版&高清】.pdf

    但是,根据标题《JavaScript DOM编程艺术【第2版&高清】.pdf》和描述“JavaScript DOM编程艺术,高清资源,无比经典,值得拥有”,我们可以推断这本书主要讲述了JavaScript中DOM(文档对象模型)的相关编程技术。...

    JavaScript DOM编程艺术.pdf

    《JavaScript DOM编程艺术》是Jeremy Keith所著的一本关于JavaScript和DOM(文档对象模型)编程的经典图书,它不仅阐述了JavaScript和DOM的基本知识,还着重讲解了DOM编程技术背后的思路和原则。本书被赞誉为Web设计...

    JavaScript DOM编程艺术(第2版pdf)+源代码

    JavaScript DOM编程艺术(第2版)是一本深受程序员喜爱的JavaScript技术书籍,专注于讲解如何使用JavaScript与Document Object Model(DOM)进行交互。DOM是Web页面的结构化表示,它允许我们通过编程方式操纵HTML和XML...

    JavaScriptDOM编程艺术(第2版)PDF版本下载.txt

    根据提供的文件信息,我们可以推断出这是一本关于JavaScript DOM编程技术的书籍——《JavaScript DOM编程艺术(第2版)》。尽管实际书籍内容并未给出,但从标题、描述及部分链接信息来看,这本书主要涉及JavaScript...

    随书光盘+PDF JavaScript DOM编程艺术(第2版)-源代码2.5MB PDF114MB .zip

    JavaScript DOM编程艺术(第2版)是一本深受开发者欢迎的书籍,主要涵盖了JavaScript语言在Web前端开发中的应用,特别是关于DOM(Document Object Model)的深入理解和实践。这本书的随书光盘包含了源代码和PDF电子版...

    经典之作javascript dom编程艺术源码

    JavaScript DOM编程艺术是一本深入解析DOM操作的经典书籍,它的源码提供了丰富的实例,帮助开发者深入理解如何使用原生JavaScript高效地操纵网页元素。DOM(Document Object Model)是HTML和XML文档的标准表示,它将...

    JavaScript dom操作 删除元素 示例代码

    JavaScript dom操作 删除元素 示例代码JavaScript dom操作 删除元素 示例代码JavaScript dom操作 删除元素 示例代码JavaScript dom操作 删除元素 示例代码JavaScript dom操作 删除元素 示例代码JavaScript dom操作 ...

    JavaScript dom操作 访问和修改元素 示例代码

    JavaScript dom操作 访问和修改元素 示例代码JavaScript dom操作 访问和修改元素 示例代码JavaScript dom操作 访问和修改元素 示例代码JavaScript dom操作 访问和修改元素 示例代码JavaScript dom操作 访问和修改...

    JavaScript dom操作 添加和替换元素 示例代码

    JavaScript dom操作 添加和替换元素 示例代码JavaScript dom操作 添加和替换元素 示例代码JavaScript dom操作 添加和替换元素 示例代码JavaScript dom操作 添加和替换元素 示例代码JavaScript dom操作 添加和替换...

    JavascriptDOM基本操作

    JavascriptDOM基本操作 dom 精品操作

    javascript dom2 源码及pdf

    总的来说,JavaScript DOM2是Web开发中的关键工具,它让JavaScript成为了一种强大的客户端脚本语言,为网页带来了丰富的动态性和交互性。通过学习和实践,开发者可以提高网页的用户体验,创建出更加智能和灵活的Web...

    JavaScript DOM编程艺术(中文第2版).pdf

    javascript入门必备,本书讲述了JavaScript和DOM的基础知识,但重点放在DOM编程技术背后的思路和原则:预留退路、循序渐进和以用户为中心等,这些概念对于任何前端Web开发工作都非常重要。本书将这些概念贯穿在书中...

    javascript Dom 编程艺术

    本 书在简洁明快地讲述JavaScript和DOM的基本知识之后,通过几个实例演示了专业水准的网页开发技术,透彻阐述了平稳退化等一批至关重要的 JavaScript编程原则和最佳实践,并全面探讨了HTML5以及jQuery等JavaScript库...

    javascriptDom编程艺术+源码

    《JavaScript DOM编程艺术》是一本深受开发者欢迎的JavaScript学习书籍,专注于DOM(Document Object Model)这一核心概念。DOM是Web页面的结构模型,通过JavaScript与DOM的交互,开发者可以实现对网页内容的动态...

    JavascriptDOM编程视频教程(17讲)

    教程名称:Javascript DOM编程视频教程(17讲) 课程目录:【】1.JavascriptDOM编程_在什么位置编写JS代码【】10.JavascriptDOM编程_删除节点【】11.JavascriptDOM编程_添加删除节点的实验...

    JavaScriptDOM编程艺术

    《JavaScript DOM编程艺术》是一本深入探讨JavaScript与DOM(Document Object Model)交互的权威书籍。DOM是HTML和XML文档的结构化表示,JavaScript通过DOM API能够对网页内容进行动态操作,实现丰富的交互效果。...

    JavaScript.DOM编程艺术(第2版)附录及源码.rar

    《JavaScript.DOM编程艺术(第2版)》是一本深入探讨JavaScript与DOM(Document Object Model)交互的权威书籍。DOM是Web开发中的核心组件,它允许程序员通过JavaScript来操作HTML和XML文档的结构、内容和样式。这本书...

    JavaScriptDOM编程艺术第二版

    JavaScript DOM编程艺术第二版是一本深入探讨JavaScript与DOM(Document Object Model)交互的权威书籍,主要面向希望提升JavaScript技能并掌握网页动态效果开发的Web开发者。DOM是HTML和XML文档的编程接口,它允许...

Global site tag (gtag.js) - Google Analytics