ethan163
- 浏览: 447338 次
- 性别:
- 来自: 北京
-
文章分类
- 全部博客 (211)
- java (37)
- spring相关 (3)
- struts (10)
- 面试 (1)
- jsp/servlet (18)
- 持久化框架 (1)
- IT相关新闻 (3)
- 服务器 (11)
- 插件 (4)
- pushlet (3)
- js (24)
- oracle (29)
- mysql (9)
- hibernate (5)
- 开发工具 (6)
- jquery (6)
- 页面标签jstl，el (1)
- linux (25)
- 英语 (1)
- log4j (1)
- html/css (6)
- sqlserver (2)
- dwr (1)
- 设计模式 (4)
- vmware (2)
- office (1)
- eclipse (5)
- svn (1)
- webservice (1)
最新评论
-
18335864773：
建议使用 pageoffice 组件套红
js操作word套红 -
lopez：
数据库系统的客户程序只要向数据库系统声明了一个事务，数据库系统 ...
Hibernate事物控制与管理 -
liujq4512：
删了还是没用
An internal error occurred during: "Initializing Java Tooling". -
elaine0111：
非常感谢这篇文章，嘿嘿，解决了我的问题。我把这段代码保存在我的 ...
Js设置文本框中焦点位置在最后 -
weishuguangeye：
不错！
单例模式（Singleton）
将HTML DOM中几个容易常用的属性做下记录：
nodeName、nodeValue 以及 nodeType 包含有关于节点的信息。
nodeName 属性含有某个节点的名称。
元素节点的 nodeName 是标签名称
属性节点的 nodeName 是属性名称
文本节点的 nodeName 永远是 #text
文档节点的 nodeName 永远是 #document
注释：nodeName 所包含的 XML 元素的标签名称永远是大写的
nodeValue
对于文本节点，nodeValue 属性包含文本。
对于属性节点，nodeValue 属性包含属性值。
nodeValue 属性对于文档节点和元素节点是不可用的。
nodeType
nodeType 属性可返回节点的类型。
最重要的节点类型是：
元素类型 节点类型
元素element 1
属性attr 2
文本text 3
注释comments 8
文档document 9
HTML文件:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DOM标准</title>
<script type="text/javascript" src="test.js"></js>
</head>
<body>
<h1 id="h1">An HTML Document</h1>
<p id="p1">This is a <i>W3C HTML DOM</i> document.</p>
<p><input id="btnDemo1" type="button" value="取H1 Element节点值"></p>
<p><input id="btnDemo2" type="button" value="取H1 Element节点文本"></p>
<p><input id="btnDemo3" type="button" value="取Document Element节点文本"></p>
<p><input type="button" alt="这是个演示按钮" title="演示按钮提示标题" name="btnShowAttr" id="btnShowAttr" value="按钮节点演示" /></p>
</body>
</html>JS:
function showElement(){
var element=document.getElementById("h1");//h1是一个<h1>标签
alert('nodetype:'+element.nodeType);//nodeType=1
alert('nodeName:'+element.nodeName);
alert('nodeValue:'+element.nodeValue); //null
alert('element:'+element);
}
function showText(){
var element=document.getElementById("h1");
var text=element.childNodes[0];
alert('nodeType:'+text.nodeType); //nodeType=3
alert('nodeValue:'+text.nodeValue); //文本节点的nodeValue是其文本内容
text.nodeValue=text.nodeValue+"abc"; //文本内容添加修改删除等等。
alert('nodeName:'+text.nodeName);
alert(text.data); //data同样是其内容,这个属性下同样可以增删改。
}
function showDocument(){
alert('nodeType:'+document.nodeType); //9
alert('nodeName:'+document.nodeName);
alert(document);
}
function showAttr(){
var btnShowAttr=document.getElementById("btnShowAttr"); //演示按钮，有很多属性
var attrs=btnShowAttr.attributes;
for(var i=0;i<attrs.length ;i++){
var attr=attrs[i];
alert('nodeType:'+attr.nodeType); //attribute 的nodeType=2
alert('attr:'+attr);
alert('attr.name:'+attr.name+'='+attr.value);
}
}
function demo(){
var btnDemo1=document.getElementById("btnDemo1");
btnDemo1.onclick=showElement; //按钮1取节点nodetype值
var btnDemo2=document.getElementById("btnDemo2");
btnDemo2.onclick=showText;
var btnDemo3=document.getElementById("btnDemo3");
btnDemo3.onclick=showDocument;
var btnShowAttr=document.getElementById("btnShowAttr");
btnShowAttr.onclick=showAttr;
}
window.onload=demo;
注释：Internet Explorer 会忽略节点之间生成的空白文本节点（比如换行字符），而 Mozilla 不这么做。因此，在下面的例子中，我们用一个函数来检测第一个子节点的节点类型。
元素节点的节点类型是 1，因此假如第一个子节点不是元素节点，则移动到下一个节点，并检测该节点是否是元素节点。这个过程一直持续到找到第一个子节点为止。这种方法可以确保在 Internet Explorer 和 Mozilla 都获得正确的结果。
如需更多有关 IE 与 Mozilla 浏览器差异的内容，请访问 W3School 的 XML DOM 教程中的 DOM 浏览器 这一节。
实例
在所有的例子中，我们将使用 XML 文件 books.xml，以及 JavaScript 函数 loadXMLDoc()。
下面的代码片段从 "books.xml" 中获取第一个子节点：
//check if the first node is an element node
function get_firstchild(n)
{
var x=n.firstChild;
while (x.nodeType!=1)
{
x=x.nextSibling;
}
return x;
}
xmlDoc=loadXMLDoc("books.xml");
var x=xmlDoc.documentElement;
var firstNode=get_firstchild(x);
for (var i=0;i<firstNode.childNodes.length;i++)
{
if (firstNode.childNodes[i].nodeType==1)
{
//Process only element nodes
document.write(firstNode.childNodes[i].nodeName);
document.write(" = ");
document.write(firstNode.childNodes[i].childNodes[0].nodeValue);
document.write("<br />");
}
}以上代码的输出：
title = Everyday Italian
author = Giada De Laurentiis
year = 2005
price = 30.00
nodeName、nodeValue 以及 nodeType 包含有关于节点的信息。
nodeName 属性含有某个节点的名称。
元素节点的 nodeName 是标签名称
属性节点的 nodeName 是属性名称
文本节点的 nodeName 永远是 #text
文档节点的 nodeName 永远是 #document
注释：nodeName 所包含的 XML 元素的标签名称永远是大写的
nodeValue
对于文本节点，nodeValue 属性包含文本。
对于属性节点，nodeValue 属性包含属性值。
nodeValue 属性对于文档节点和元素节点是不可用的。
nodeType
nodeType 属性可返回节点的类型。
最重要的节点类型是：
元素类型 节点类型
元素element 1
属性attr 2
文本text 3
注释comments 8
文档document 9
HTML文件:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DOM标准</title>
<script type="text/javascript" src="test.js"></js>
</head>
<body>
<h1 id="h1">An HTML Document</h1>
<p id="p1">This is a <i>W3C HTML DOM</i> document.</p>
<p><input id="btnDemo1" type="button" value="取H1 Element节点值"></p>
<p><input id="btnDemo2" type="button" value="取H1 Element节点文本"></p>
<p><input id="btnDemo3" type="button" value="取Document Element节点文本"></p>
<p><input type="button" alt="这是个演示按钮" title="演示按钮提示标题" name="btnShowAttr" id="btnShowAttr" value="按钮节点演示" /></p>
</body>
</html>JS:
function showElement(){
var element=document.getElementById("h1");//h1是一个<h1>标签
alert('nodetype:'+element.nodeType);//nodeType=1
alert('nodeName:'+element.nodeName);
alert('nodeValue:'+element.nodeValue); //null
alert('element:'+element);
}
function showText(){
var element=document.getElementById("h1");
var text=element.childNodes[0];
alert('nodeType:'+text.nodeType); //nodeType=3
alert('nodeValue:'+text.nodeValue); //文本节点的nodeValue是其文本内容
text.nodeValue=text.nodeValue+"abc"; //文本内容添加修改删除等等。
alert('nodeName:'+text.nodeName);
alert(text.data); //data同样是其内容,这个属性下同样可以增删改。
}
function showDocument(){
alert('nodeType:'+document.nodeType); //9
alert('nodeName:'+document.nodeName);
alert(document);
}
function showAttr(){
var btnShowAttr=document.getElementById("btnShowAttr"); //演示按钮，有很多属性
var attrs=btnShowAttr.attributes;
for(var i=0;i<attrs.length ;i++){
var attr=attrs[i];
alert('nodeType:'+attr.nodeType); //attribute 的nodeType=2
alert('attr:'+attr);
alert('attr.name:'+attr.name+'='+attr.value);
}
}
function demo(){
var btnDemo1=document.getElementById("btnDemo1");
btnDemo1.onclick=showElement; //按钮1取节点nodetype值
var btnDemo2=document.getElementById("btnDemo2");
btnDemo2.onclick=showText;
var btnDemo3=document.getElementById("btnDemo3");
btnDemo3.onclick=showDocument;
var btnShowAttr=document.getElementById("btnShowAttr");
btnShowAttr.onclick=showAttr;
}
window.onload=demo;
注释：Internet Explorer 会忽略节点之间生成的空白文本节点（比如换行字符），而 Mozilla 不这么做。因此，在下面的例子中，我们用一个函数来检测第一个子节点的节点类型。
元素节点的节点类型是 1，因此假如第一个子节点不是元素节点，则移动到下一个节点，并检测该节点是否是元素节点。这个过程一直持续到找到第一个子节点为止。这种方法可以确保在 Internet Explorer 和 Mozilla 都获得正确的结果。
如需更多有关 IE 与 Mozilla 浏览器差异的内容，请访问 W3School 的 XML DOM 教程中的 DOM 浏览器 这一节。
实例
在所有的例子中，我们将使用 XML 文件 books.xml，以及 JavaScript 函数 loadXMLDoc()。
下面的代码片段从 "books.xml" 中获取第一个子节点：
//check if the first node is an element node
function get_firstchild(n)
{
var x=n.firstChild;
while (x.nodeType!=1)
{
x=x.nextSibling;
}
return x;
}
xmlDoc=loadXMLDoc("books.xml");
var x=xmlDoc.documentElement;
var firstNode=get_firstchild(x);
for (var i=0;i<firstNode.childNodes.length;i++)
{
if (firstNode.childNodes[i].nodeType==1)
{
//Process only element nodes
document.write(firstNode.childNodes[i].nodeName);
document.write(" = ");
document.write(firstNode.childNodes[i].childNodes[0].nodeValue);
document.write("<br />");
}
}以上代码的输出：
title = Everyday Italian
author = Giada De Laurentiis
year = 2005
price = 30.00
分享到：
发表评论
-
在模态窗口中提交后,如何关闭窗口再刷新父页面
2011-12-14 14:11 19051.dialogArguments.location.assi ... -
js操作word套红
2011-11-01 16:28 6207//(标准版) //隐藏或显示修订痕迹 function j ... -
JS表单WORD常用操作
2011-10-18 17:14 1644tablesObj.Cell(行, 列).Split(1,3) ... -
js触发onclick事件
2011-04-21 11:24 1995if(document.all){ document. ... -
javascript中showModalDialog和showModelessDialog区别
2011-03-03 13:19 1023javascript中showModalDialog和 ... -
js提交表单
2010-12-19 16:18 37141.document.forms.from.submit(); ... -
JS刷新父窗口的几种方式
2010-12-10 10:02 1033浮层内嵌iframe及frame集合窗口，刷新父页面的多种方法 ... -
JavaScript的Table表格对象
2010-12-04 14:16 984Table表格对象 Table对象: ... -
js如何获取上传图片的大小
2010-11-29 16:41 2600<%@ page language="java ... -
JavaScript 修改注册表来改变“工具--Internet选项”（转载）
2010-11-29 10:22 2195注册表有关安全设置项的说明： 注册表路径： HKEY_CURR ... -
利用javascript判断浏览器是否已经安装ActiveX控件和是否禁止运行ActiveX控件
2010-11-28 09:56 1786从微软给IE打上SP2以后 ... -
js动态时间代码
2010-11-04 16:12 1300<SCRIPT language=JavaScript& ... -
刷新父页面，javacript
2010-11-02 21:48 990用iframe、弹出子页面刷新父页面iframe Js代码 ... -
常用限制input的方法
2010-10-17 16:47 876常用限制input的方法 1.取消按钮按下时的虚线框,在inp ... -
Js设置文本框中焦点位置在最后
2010-09-18 12:06 3686在一般的程序中.程序员做输入框内容正确性检测时一般喜欢通过判断 ... -
事件属性
2010-09-09 16:14 871窗口事件 (Window Events) 仅在 body 和 ... -
alt属性和title属性
2010-09-08 09:04 881alt属性和title属性 当浏 ... -
window.open()用法详解
2010-09-05 22:48 1200window.open()的所有参数列表 前言:经常上网 ... -
js转码函数
2010-09-04 22:26 4724escape()编码,不能编码URI unescape()解 ... -
在ModalDialog中操作父窗口对象（转帖）
2010-09-03 10:39 14681、不能使用window.parent Window.par ...
相关推荐
nodeName、nodeValue 以及 nodeType 包含有关于节点的信息。nodeName 属性含有某个节点的名称。... 对于属性节点，nodeValue 属性包含属性值。 nodeValue 属性对于文档节点和元素节点是不可用的。 nodeType nodeT
目录如下： 1. DOM可以做什么？ 2. DOM的结构 3. 访问DOM节点1——getElementById() ...7. DOM信息nodeType的应用 8. 修改DOM——innerHTML 9. 删除DOM节点——removeChild 10. 添加DOM节点 11. DOM简介总结
2 .nodeType 值：1，元素节点；2，属性节点；3，文本节点。nodeType是只读的。 3 .nodeValue 返回一个字符串，指示这个节点的值。元素节点返回null，属性节点返回属性值，文本节点返回文本。nodeValue可读可写，这...
2. nodeValue ：节点的值 3. nodeType ：节点的类型 节点类型：元素 1 ，属性 2 ，文本 3 ，注释 8，文档 9。 一、添加和删除节点（HTML 元素） 1、创建节点 1）创建该元素（元素节点）； 2）向一个已存在的元素...
浏览器会根据DOM模型，将HTML文档解析成一系列的节点，再由这些节点组成一个树状结构。DOM的最小组成单位叫做节点(node)，文档的树形结构(DOM树)由12种类型的节点组成。 属性 一般地，节点至少拥有nodeType、...
1.访问相关的节点 2.检测节点类型(nodeType) 3.处理特性 4.访问指定节点 5.创建和操作节点
Neos NodeType：HTML 该程序包实现了一个节点类型Html以显示任意html代码。 这最初是Neos.NodeTypes包的一部分。 贡献 如果您想为Neos做出贡献，请查看它是用于开发的存储库，所有请求请求都应包含在其中。
本文是对Js nodeType的属性进行了全面分析介绍，需要的朋友可以过来参考下，希望对大家有所帮助
主要介绍了nodeType属性返回被选节点的节点类型。需要的朋友可以过来参考下，希望对大家有所帮助
要判断一个对象是否DOM对象，首先想到的无非就是它是否具有DOM对象的各种属性或特征，比如是否有nodeType属性，有tagName属性，等等。判断的特征越多，也就越可靠，因为毕竟我们自定义的js对象也可以有那些属性。...
本文详细介绍了nodeName、nodeValue和nodeType属性
DOM1级定义了一个Node接口，该接口是由DOM中的所有节点类型实现。每个节点都有一个nodeType属性，用于表明节点的类型，节点类型在Node类型中有以下几种： Node.ELEMENT_NODE(1); 元素节点 Node.ATTRIBUTE_NODE(2); ...
本文实例讲述了JavaScript DOM元素常见操作。分享给大家供大家参考，具体如下： DOM概念 DOM（Document Object Model）：文档对象模型。 通过开发者工具的Elements标签页可以...th1.nodeType); alert(th1.nodeName
DOM模型中的节点：元素节点、文本节点、属性节点 例：私のdotnet小屋</a> （1）a是元素节点 （2）“私のdotnet小屋”是文本节点 （3）href=”http://www.cnblogs.com/shuz”是属性节点 DOM节点的属性 属性 类型...
使用getElementById()方法来访问指定id的节点，并用nodeName属性、nodeType属性和nodeValue属性来显示出该节点名称、节点类型和节点值。 1、nodeName属性 该属性用来获取某一个节点的名称。 [sName=]obj.nodeName ...
本程序中接口的命令，参数注释均来自官方接口的注释，同时加入了“nodeType_”开头的常量。（它代表节点的节点类型。） 由于ie的问题，本程序的“querySelector”并不支持CSS3语法，但是确实是够用了。 拓展封装部分...
-children 兼容版的获取子节点，也可理解为获取元素下的元素节点-nodeType 返回节点样式(只返回数字，数字1代表元素节点，数字2代表属性
Dom基本操作DOM查找节点的类型 nodeType遍历节点树基于元素节点树的遍历节点的四个属性DOM继承树DOM修改修改属性修改样式DOM添加添加元素优化 带着例子学Dom 几行代码就搞定！ DOM查找 document代表整个文档 按id...