DOM中元素节点,属性节点,文本节点的理解
节点信息
每个节点都拥有包含着关于节点某些信息的属性。这些属性是:
- nodeName(节点名称)
- nodeValue(节点值)
- nodeType(节点类型)
nodeType
nodeType 属性可返回节点的类型。
最重要的节点类型是:
元素类型 | 节点类型 |
---|---|
元素 | 1 |
属性 | 2 |
文本 | 3 |
注释 | 8 |
文档 | 9 |
在实际应用中,经常用到的就是元素节点、属性节点和文本节点了,下面我们通过小段代码进行讲解
1:元素节点
- <HEAD>
- <TITLE>空谷悠悠</TITLE>
- </HEAD>
- <BODY>
- <table>
- <tr>
- <td id="john" name="myname">John</td>
- <td>Doe</td>
- <td id="jack">Jack</td>
- </tr>
- </table>
- <script>
- var d = document.getElementById("john");
- alert(d.nodeType)
- alert(d.nodeName)
- alert(d.nodeValue)
- </script>
- </BODY>
- </HTML>
分析运行结果,其三个属性的值分别为:
nodeType:ELEMENT_NODE
nodeType值:1
nodeName:元素标记名 //此处为TD
nodeValue:null
2:属性节点
- <HEAD>
- <TITLE>空谷悠悠</TITLE>
- </HEAD>
- <BODY>
- <table>
- <tr>
- <td id="john" name="myname">John</td>
- <td>Doe</td>
- <td id="jack">Jack</td>
- </tr>
- </table>
- <script>
- var d = document.getElementById("john").getAttributeNode("name");
- alert(d.nodeType)
- alert(d.nodeName)
- alert(d.nodeValue)
- </script>
- </BODY>
- </HTML>
分析运行结果,其三个属性的值分别为:
nodeType:ATTRIBUTE_NODE
nodeType值:2
nodeName:属性名 // name
nodeValue:属性值 //myname
3:文本节点
- <HEAD>
- <TITLE> New Document </TITLE>
- </HEAD>
- <BODY>
- <table>
- <tr>
- <td id="john" name="myname">John</td>
- <td>Doe</td>
- <td id="jack">Jack</td>
- </tr>
- </table>
- <script>
- var d = document.getElementsByTagName("td")[0].firstChild
- alert(d.nodeType)
- alert(d.nodeName)
- alert(d.nodeValue)
- </script>
- </BODY>
- </HTML>
分析运行结果,其三个属性的值分别为:
nodeType:TEXT_NODE
nodeType值:3
nodeName:#text
nodeValue:文本内容 // John
DOM中元素节点,属性节点,文本节点的理解的更多相关文章
- DOM中元素节点、属性节点、文本节点
DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...
- DOM中元素节点、属性节点、文本节点的理解
DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) ...
- 认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构(节点树)。
认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...
- [转]XML中元素(Element)与节点(Node)的区别
前言: element是特殊的node 一段纯文本即text-node也是node 但不是element w3c的原话是 A node can be an element node, an attri ...
- contents() 查找匹配元素内部所有的子节点(包括文本节点)。如果元素是一个iframe,则查找文档内容
contents() V1.2概述 查找匹配元素内部所有的子节点(包括文本节点).如果元素是一个iframe,则查找文档内容 示例 描述:大理石平台检定规程 查找所有文本节点并加粗 HTML 代码 ...
- windows phone xaml文件中元素及属性(10)
原文:windows phone xaml文件中元素及属性(10) Textblock xaml文件和隐藏文件 在设计界面的时候我们可以通过xaml中进行设计,这种设计是所见即所得的,很是方便,由于x ...
- php的form中元素name属性相同时的取值问题
php的form中元素name属性相同时的取值问题:修改元素的名称,在名称后面加上 '[]',然后取值时即可得array()数组. 一.以复选框为例: <html> <head> ...
- DOM中元素节点、属性节点、文本节点的理解13.3
节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型) nodeType nodeType 属性可返 ...
- Javascript进阶篇——(DOM—节点---属性、访问节点)—笔记整理
节点属性在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType : ...
随机推荐
- Codeforces Round #FF (Div. 2) D. DZY Loves Modification 贪心+优先队列
链接:http://codeforces.com/problemset/problem/447/D 题意:一个n*m的矩阵.能够进行k次操作,每次操作室对某一行或某一列的的数都减p,获得的得分是这一行 ...
- UML的基本图(二)
Both sequence diagrams and communication diagrams are kinds of interaction diagrams. An interacti ...
- JavaScript高级特性之原型
JavaScript的原型 原型prototype属性仅仅适用于函数对象(这里的函数对象是自己为了理解更好定义的,普通对象是没有原型属性的) 1.研究函数原型: <script type=&qu ...
- HTTP缓存和CDN缓存
一 http缓存 1.1缓存的分类: http中具有缓存功能的是:1.浏览器缓存. 2.缓存代理服务器. 1.2 什么是缓存: http缓存的是指:当Web请求抵达缓存时, 如果本地有“已缓存的”副 ...
- C语言高速入门系列(一)
C语言高速入门系列(一) 本系列引言: 本教程的宗旨是将C语言入门的内容进行关键知识点的提纯,将一些笼统的废话去除; 再进行压缩,然后将本章的关键知识点做成路线图的,能够更加方便地掌握学习的方向; ...
- 关于move_uploaded_file()出错的问题
move_upload0ed_file()函数返回參数较少.可是引起出错的原因却有非常多,所以对于刚開始学习的人难免会遇到问题. 出错原因大概有下面三点: 1.假设检測到文件不是来自post上传.这个 ...
- 0x53 区间DP
石子合并 搞笑 #include<cstdio> #include<iostream> #include<cstring> #include<cstdlib& ...
- KAFKA 调优
KAFKA 调优 最近要对kafka集群做调优,就在网上看了些资料,总结如下. 我们的kafka版本是0.10.1.0. 机器配置是40G内存,300G硬盘. 一共有3台机器组成一个小的集群. Kak ...
- shopping car 1.0
#!/usr/bin/env python# -*- coding: utf-8 -*-# @File : 20180510001.py# @Author: Anthony.waa# @Date : ...
- Javascript中数组重排序方法详解
在数组中有两个可以用来直接排序的方法,分别是reverse()和sort().下面通过本文给大家详细介绍,对js 数组重排序相关知识感兴趣的朋友一起看看吧. 1.数组中已存在两个可直接用来重排序的方法 ...