nodename、nodevalue 以及 nodetype 包含有关于节点的信息。
nodename 属性含有某个节点的名称。
元素节点的 nodename 是标签名称
属性节点的 nodename 是属性名称
文本节点的 nodename 永远是 #text
文档节点的 nodename 永远是 #document
注释:nodename 所包含的 xml 元素的标签名称永远是大写的
nodevalue
对于文本节点,nodevalue 属性包含文本。
对于属性节点,nodevalue 属性包含属性值。
nodevalue 属性对于文档节点和元素节点是不可用的。
nodetype
nodetype 属性可返回节点的类型。
最重要的节点类型是:
补充:
值-元素类型
1-element
2-attribute
3-text
4-cdata
5-entity reference
6-entity
7-pi (processing instruction)
8-comment
9-document
10-document type
11-document fragment
12-notation
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;
更多html dom的nodetype值介绍。