首頁 > web前端 > js教程 > JavaScript操作XML/HTML比較常用的物件屬性集錦_javascript技巧

JavaScript操作XML/HTML比較常用的物件屬性集錦_javascript技巧

WBOY
發布: 2016-05-16 15:34:25
原創
1095 人瀏覽過

節點物件屬性

childNodes—傳回節點到子節點的節點清單

firstChild—傳回節點的首個子節點。
lastChild—傳回節點的最後一個子節點。

nextSibling—返回節點之後緊接的同級節點。

nodeName—傳回節點的名字,依其型別。
nodeType—傳回節點的類型。
nodeValue—設定或傳回節點的值,根據其類型。

ownerDocument—傳回節點的根元素(document物件)。

parentNode—傳回節點的父節點。

previousSibling—回到節點之前緊接的同級節點。

text—傳回節點及其後代的文字(IE獨有)。

xml—傳回節點及其後代的XML(IE獨有)。

節點物件的方法

appendChild()—在節點的子節點清單的結尾新增新的子節點。

cloneNode()—複製節點。

hasChildNodes()—判斷目前節點是否擁有子節點。

insertBefore()—在指定的子節點前插入新的子節點。

normalize()—合併相鄰的Text節點並刪除空的Text節點。

removeChild()—刪除(並傳回)目前節點的指定子節點。

replaceChild()—用新節點取代一個子節點。

IE6獨有

selectNodes()—用一個XPath表達式查詢選擇節點。

selectSingleNode()—尋找和XPath查詢相符的一個節點。

transformNode()—使用XSLT把一個節點轉換成一個字串。

transformNodeToObject()—使用XSLT把一個節點轉換成一個文件。

NodeList物件

length –傳回節點清單中的節點數目。

item()—傳回節點清單中處於指定的索引號的節點。

例如:

Javascript程式碼

xmlDoc = loadXMLDoc(“books.xml”); 
var x = xmlDoc.getElementsByTagName(“title”); 
document.write(“title element:” + x.length); 
登入後複製

輸出:title element:4

Javascript程式碼

var y = xmlDoc.documentElement.childNodes; 
document.write(y.item(0).nodeName); 
登入後複製

輸出:book

NamedNodeMap物件

length—傳回清單中節點數目。

getNamedItem()—傳回指定的節點。 (透過名稱)

item()—傳回處於指定索引號的節點。

removeNamedItem()—刪除指定的節點(根據名稱)。

例如:

Javascript程式碼

xmlDoc = loadXMLDoc(“books.xml”); 
var x = xmlDoc.getElementsByTagName(“book”); 
document.write(x.item(0).attributes.length); 
登入後複製

輸出:1

Javascript程式碼

document.write(x.item(0).attributes.getNamedItem(“category”); 
登入後複製

輸出:COOKING 

Javascript程式碼 

x.item(0).attributes.removeNamedItem(“category”); 
登入後複製

刪除第一個book元素的category屬性

Document物件代表整個XML文件。

Document物件的屬性。

async—規定XML檔案的下載是否應當被同步處理。

childNodes—傳回屬於文件的子節點的節點清單。

doctype—傳回與文件相關的文件類型聲明。

documentElement—傳回文件的子節點。

firstChild—傳回文件的首個子節點。

implementation—傳回處理該文件的DOMImplementation物件。 (IE沒有)

lastChild—傳回文件的最後一個子節點。

nodeType—傳回節點類型。

nodeName—依據節點的類型傳回其名稱。

nodeValue—依據節點的型別傳回其值。

text—傳回節點及其後代的文字(IE獨有)。

xml—傳回節點及其後代的XML(IE獨有)。

Document物件的方法

createAttribute(att_name)—建立擁有指定名稱的屬性節點,並傳回新的屬性物件。
createCDATASection(data)—建立CDATA區段節點。
createComment(data)—建立註解節點。
createDocumentFragment—建立空的DocumentFragment對象,並傳回此物件。
createElement(node_name)—建立元素節點。
createEntityReference(name)—建立EntityReference對象,並傳回此對象。 (IE獨有)
createTextNode(data)—建立文字節點。
getElementById(elementid)—尋找具有指定的唯一ID的元素。
getElementsByTagName(node_name)—傳回所有具有指定名稱的元素節點。

例如:

Javascript程式碼 

var xmlDoc = loadXMLDoc("book.xml");  
xmlDoc.async = false; 
var book = xmlDoc.getElementsByTagName("book"); 
var newtext1="Special Offer & Book Sale"; 
var newCDATA=xmlDoc.createCDATASection(newtext1); 
book[0].appendChild(newCDATA); 
var newtext2="Revised September 2006"; 
var newComment=xmlDoc.createComment(newtext2); 
book[0].appendChild(newComment); 
var var newel=xmlDoc.createElement('edition'); 
var newtext3=xmlDoc.createTextNode('First'); 
newel.appendChild(newtext3); 
book[0].appendChild(newel); 
document.write("<xmp>" + xmlDoc.xml + "</xmp>"); 
登入後複製

Element 对象的属性
attributes—返回元素的属性的NamedNodeMap
childNodes—返回元素的子节点的NodeList
firstChild—返回元素的首个子节点。
lastChild—返回元素的最后一个子节点。
nextSibling—返回元素之后紧跟的节点。
nodeName—返回节点的名称。
nodeType—返回元素的类型。
ownerDocument—返回元素所属的根元素(document对象)。
parentNode—返回元素的父节点。
previousSibling—返回元素之前紧跟的节点。
tagName—返回元素的名称。
text—返回节点及其后代的文本。(IE-only)
xml—返回节点及其后代得XML。(IE-only)

Element对象的方法

appendChild(node)—向节点的子节点列表末尾添加新的子节点。
cloneNode(true)—克隆节点。
getAttribute(att_name)—返回属性的值。
getAttributeNode(att_name)—以 Attribute 对象返回属性节点。
getElementsByTagName(node_name)—找到具有指定标签名的子孙元素。
hasAttribute(att_name)—返回元素是否拥有指定的属性。
hasAttributes()—返回元素是否拥有属性。
hasChildNodes()—返回元素是否拥有子节点。
insertBefore(new_node,existing_node)—在已有的子节点之前插入一新的子节点。
removeAttribute(att_name)—删除指定的属性。
removeAttributeNode(att_node)—删除指定的属性节点。
removeChild(node)—删除子节点。
replaceChild(new_node,old_node)—替换子节点。
setAttribute(name,value)—添加新的属性或者改变属性的值。
setAttribute(att_node)—添加新的属性。

Javascript代码

x=xmlDoc.getElementsByTagName('book'); 
for(i=0;i<x.length;i++) 
{ 
attnode=x.item(i).getAttributeNode("category"); 
document.write(attnode.name); 
document.write(" = "); 
document.write(attnode.value); 
document.write("<br />"); 
} 
for(i=0;i<x.length;i++){ 
document.write(x[i].getAttribute('category')); 
document.write("<br />"); 
} 
xmlDoc=loadXMLDoc("/example/xdom/books.xml"); 
x=xmlDoc.getElementsByTagName('book'); 
document.write(x[0].getAttribute('category')); 
document.write("<br />"); 
x[0].removeAttribute('category'); 
document.write(x[0].getAttribute('category')); 
var attnode = x[1].getAttributeNode("category"); 
var y = x[1].removeAttributeNode(attnode); 
document.write("<xmp>" + xmlDoc.xml + "</xmp>"); 
function get_lastchild(n) 
{ 
 x = n.lastChild; 
 while(x.noteType!=1){ 
  x = x.previousSibling; 
 } 
 return x; 
} 
function get_firstChild(n){ 
 x = n.firstChild; 
 whild(x.nodeType!=1){ 
 x=x.nextSibling; 
 } 
 return x; 
} 
xmlDoc=loadXMLDoc("books.xml"); 
x=xmlDoc.getElementsByTagName("book")[0]; 
deleted_node=x.removeChild(get_lastchild(x)); 
document.write("Node removed: " + deleted_node.nodeName); 
登入後複製

Attr对象

Attr 对象表示 Element 对象的属性。

name—返回属性的名称。

nodeName—返回节点的名称,依据其类型

nodeType—返回节点的类型。

nodeValue—设置或返回节点的值,依据其类型

ownerDocument—返回属性所属的根元素(document对象)。

specified—如果属性值被设置在文档中,则返回 true,如果其默认值被设置在 DTD/Schema 中,则返回 false。

value—设置或返回属性的值。

text—返回属性的文本。IE-only。

xml—返回属性的 XML。IE-only。

Text对象的属性

data—设置或返回元素或属性的文本。

length—返回元素或属性的文本长度。

Text对象的方法

appendData(string)—向节点追加数据。

deleteData(start,length)—从节点删除数据。

insertData(start,string)— 向节点中插入数据。

replaceData(start,length,string)—替换节点中的数据。

replaceData(offset)— 把一个 Text 节点分割成两个。

substringData(start,length)— 从节点提取数据。

关于JavaScript操作XML/HTML比较常用的对象属性集锦的全部叙述就到此结束了,更多内容请登陆脚本之家官网了解更多,谢谢。

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板