第十章

10.1.4 text类型

nodeType=3

nodeName="#text"

nodevalue

appendData(text)  //添加text至末尾

insertData(offset,text) //从位置offset插入text

deleteData(offset，count)  //从位置offsets删除count个字符

replaceData(offset,count,text) //text替代从位置offfset到offset+count的内容

splitText(offset)  //从位置offset位置将当前文本分成两个文本节点

substringData(offset,cout)  //提取从位置offset到offset+count为止的字符串

div.firstChild.nodeValue="dfvdfvdff"

1.创建文本节点

var e=document.createElement("div");
e.className="message";

var textNode1=document.createTextNode("hello world");

var textNode2=document.createTextNode("hello world");

e.appendChild(textNode1);

e.appendChild(textNode2);

document.body.appendChild(e);

alert(e.firstChild.nodeValue);    //hello world

e.normalize();  //将两个相邻的同胞节点合并的方法(规划文本节点)

alert(e.firstChild.nodeValue);     //hello worldhello world

var e=document.createElement("div");
e.className="message";

var textNode1=document.createTextNode("hello world");

e.appendChild(textNode1)

var newnode1=e.firstChild.splitText(5);

alert(e.firstChild.nodeValue);  //"hello"

alert(newnode.nodeValue);  //" world"

alert(e.childNodes.length);  //2

cpmment类型

nodeType的值为8

nodeType "#comment"

nodeValue 注释内容

<div id="myDiv"><!--A comment--></div>

var div=document.getElementById("myDiv");

var comment=div.firstChild;

alert(comment.data);  //"A comment"

var com=document.createComment("Acomment");  // 创建注释

CDATASection类型，CDATA区域只会出现在XML文档中，IE9之前版本不支持这个类型

nodeType的值 4

nodeName "#cdata-section"

在真正的XML文档中，可以使用document.createDataSection()来创建CDATA区域，只需为其传入节点的内容即可。

DocumentFragment类型

位<ul>元素添加3个列表项，如果逐个的添加俩表想，将会导致浏览器反复渲染呈现新信息，为避免这个问题，可以像下面这样使用文档片段保存列表项，然后再一次性将他们添加到文档中。

<ul id="myList"></ul>

var fragment=document.createDocumentFragment();  、//创建文档片段

var ul=document.getElementById("mylist");

var li=null;

for(var i=0;i<3;i++){

li=document.createElement("li");

li.appendChild(document.createTextNode("Item"+(i+1)));

fragment.appendChild(li);  //使用文档片段保存列表项

}

ul.appendChild(fragment);  //文档片段的所有子节点都被删除并转移到了<ul>元素中。

Attr类型，元素的特性，有三个属性：name/value/specified

nodeType的值为2，

var attr=document.createAttribute("align");

attr.value="left";

element.setAttributeNode(attr);    //为了将新创建的特性添加到元素中，必须使用setAttributeNode（）方法

alert(element.getAttribute("align"));  //left

element类型

nodeType 的值为1

nodeValue的值为null

<div id="q"></div>

var d=documment.getElementById("q");

alert(d.tagName);  //"DIV"

alert(d.tagName=d.nodeName)  //true

if(d.tagName.lowerCase()=="div"){

} //d.tagName实际上输出的是DIV而不是div,所以用d.tagName.lowerCase()

alert(d.getattribute("id"));  //q

d.setAttribute("clsee","ft");

d.removeAttribute("class");

attributes属性（不方便，开饭人员一般用getAttributes()、setAttribute（）、removeAtribute(),不过想要遍历元素的特性，可以用）

var id=element.attributes.getNamedItem("id").nodeValue;

var id=element.attributes["id"].nodeValue;

element.attributes["id"].nodeValue="someOtherId";

var oldattr=element.attributes.removeNamedItem("id");

var oldattr=element.attributes.setNamedItem(newAttr);  //不常用

遍历元素的特性

function a(element)

{var paris=new Array(), nodename ,nodevalue,i,len; 

for(var  i=0,len=element.attributes.length;i<len;i++)

{

nodename=Element.attribute[i].nodeName;

nodevalue=Element.attribute[i].nodeValue;

if(Element.attribute[i].specified)

{

paris.push(nodename+"=\""+nodevalue+"\"");

}

}return paris.join(" ");

}

document类型

nodeType的值9

nodeName的值为“#document”

var html=document.documentElement;

alert(html===document.childNodes[0]);  //true

alert(html===document.firstChild);  //true

var a=document.title;  //取得文档标题

document.title="hello";  //"hello"  设置文档标题

var a=document.URL;  //取得完整的url

var b=document.referrer;  //取得来源页面的url
var c=document.domain;//取得域名

var img=document.getElementsByTagName("img");

alert(img.length);  //图像数量

alert(img[0].src);  //输出第一个图像元素的src特性

alert(img.item(0).src);  //输出第一个图像元素的src特性

<img src="a.gif"name="myimage">

var img=images.namedItem("myimage");  //取得img元素

var img=images["myimage"];  //取得img元素

var img=document.getElementByName("myimage"); //取得img元素

dom分为多个级别也包含多个部分，检查浏览器实现了dom的哪些部分就十分必要document.implementation

var hasXmlDom=document.implementation.hasFeature("XML","1.0");

文档写入

window.οnlοad=function(){alert("hello world")};  //页面完全加载完成后延迟执行函数

open();  //打开新网页

close();  //关闭网页

write();

writeln();

someNode.appendChild(newnode);  //插入后成为最后一个子节点

someNode.insertBefore(newnode,null);  //当参照节点为null，插入后成为最后一个子节点

someNode.appendChild(newnode,somenode.firstChild);  //插入后成为第一个子节点

someNode.replaceChild(newnode,somenode.firstChild);  //第一个参数要插入的节点，第二个参数要替换的节点。

someNode.removeChild(someNode.firstChild);  //移除第一个子节点

<ul>

<li></li>

<li></li>

<li></li>

</ul>

var deeplist=mylist.cloneNode(true);

alert(deeplist.childNodes.length);  //3   深复制

var shallowlist=mylist.cloneNode(false);

alert(shallowlist.childNodes.length);  //0