通過此文章介紹Text中一些常用方法,文本節(jié)點(diǎn)由Text類型表示,包含的是可以照字面解釋的純文本內(nèi)容。純文本中可以包含轉(zhuǎn)義后的HTML字符,但不能包含HTML代碼。Text節(jié)點(diǎn)具有以下特征:
◎nodeType的值為3;
◎nodeName的值為"#text";
◎nodeValue的值為節(jié)點(diǎn)所包含的文本;
◎parentNode是一個(gè)Element;
◎不支持(沒有)子節(jié)點(diǎn)。
可以通過nodeValue屬性或data屬性訪問Text節(jié)點(diǎn)中包含的文本,這兩個(gè)屬性中包含的值相同。對nodeValue的修改也會(huì)通過data反映出來,反之亦然。使用下列方法可以操作節(jié)點(diǎn)中的文本:
◎appendData( text):將text添加到節(jié)點(diǎn)的末尾;
◎deleteData( offset,count):從offset指定的位置開始刪除count個(gè)字符;
◎insertData( offset,text):在offset指定的位置插入text;
◎replaceData( offset,count,text):用text替換從offset指定的位置開始到offset count為止處的文本;
◎splitText( offset):從offset指定的位置將當(dāng)前文本節(jié)點(diǎn)分成兩個(gè)文本節(jié)點(diǎn);
◎substringData(offset,count):提取從offset指定的位置開始到offset+count為止處 的字符串。
除了這些方法之外,文本節(jié)點(diǎn)還有一個(gè)length屬性,保存著節(jié)點(diǎn)中字符的數(shù)目。而且,nodeValue.lenqth和data.length中也保存著同樣的值。
在默認(rèn)情況下,每個(gè)可以包含內(nèi)容的元素最多只能有一個(gè)文本節(jié)點(diǎn),而且必須確實(shí)有內(nèi)容存在。
來看幾個(gè)例子:
百恒網(wǎng)絡(luò)!
上面代碼給出的第一個(gè)
元素沒有內(nèi)容,因此也就不存在文本節(jié)點(diǎn)。開始與結(jié)束標(biāo)簽之間只要存在內(nèi)容,就會(huì)創(chuàng)建一個(gè)文本節(jié)點(diǎn)。因此,第二個(gè)
元素中雖然只包含一個(gè)空格,但仍然有一
個(gè)文本子節(jié)點(diǎn);文本節(jié)點(diǎn)的nodeValue值是一個(gè)空格。第三個(gè)
也有一個(gè)文本節(jié)點(diǎn),其nodeValue 的值為"百恒網(wǎng)絡(luò)"??梢允褂靡韵麓a來訪問這些文本子節(jié)點(diǎn):
var textNode=div. firstChild; //或者div. childNodes[0]
在取得了文本節(jié)點(diǎn)的引用后,就可以像下面這樣來修改它了:
div. firstChild. nodeValue= "http://www.myforexfactory.net"
如果這個(gè)文本節(jié)點(diǎn)當(dāng)前存在于文檔樹中,那么修改文本節(jié)點(diǎn)的結(jié)果就會(huì)立即得到反映。另外,南昌網(wǎng)站制作公司百恒網(wǎng)絡(luò)開發(fā)工程師提示大家在修改文本節(jié)點(diǎn)時(shí)還要注意,此時(shí)的字符串會(huì)經(jīng)過HTML(或XML,取決于文檔類型)編碼。換句話
說,小于號(hào)、大于號(hào)或引號(hào)都會(huì)像下面的例子一樣被轉(zhuǎn)義:
//輸出結(jié)果是"http://www. jxbh< /strong>.cn"
div. firstChild. nodeValue="http://www. jxbh.cn";
應(yīng)該說,這是在向DOM文檔中插入文本之前,先對其進(jìn)行HTML編碼的一種有效方式。
在所有瀏覽器中都可以通過腳本訪問Text類型的構(gòu)造函數(shù)和原型,包括IE8及更高版本。
本文僅限內(nèi)部技術(shù)人員學(xué)習(xí)交流,不得作于其他商業(yè)用途.希望此文對廣技人員有所幫助。原創(chuàng)文章出自:南昌網(wǎng)站建設(shè)公司-百恒網(wǎng)絡(luò) http: //www.myforexfactory.net 如轉(zhuǎn)載請注明出處!