สร้างตัวเลือก XML DOM

創建新的元素節點

createElement() 方法創建新的元素節點：

ตัวอย่าง 1

newElement = xmlDoc.createElement("edition");
xmlDoc.getElementsByTagName("book")[0].appendChild(newElement);

親自試試

การอธิบายตัวอย่าง:

  1. จะได้เรียกเข้ามาที่ books.xml แล้ว xmlDoc ใน
  2. 創建一個新的元素節點 <edition>
  3. 將這個元素節點追加到第一個 <book> 節點

ตัวอย่าง 2

循環遍歷并向所有 <book> 節點添加一個元素：

for (i = 0; i < xLen; i++) { 
    newEle = xmlDoc.createElement("edition");
    newText = xmlDoc.createTextNode("第一版");
    newEle.appendChild(newText);
    x[i].appendChild(newEle);
}

親自試試

創建新的屬性節點

createAttribute() 用於創建新的屬性節點：

ตัวอย่าง 1

newAtt = xmlDoc.createAttribute("edition");
newAtt.nodeValue = "第一版";
xmlDoc.getElementsByTagName("title")[0].setAttributeNode(newAtt);

親自試試

การอธิบายตัวอย่าง:

  1. 假設 books.xml 被加載到 xmlDoc ใน
  2. 創建新的屬性節點 "edition"
  3. 將這個屬性節點的值設置為 "first"
  4. 將這個新屬性節點添加到第一個 <title> 節點

ตัวอย่าง 2

循環遍歷所有 <title> 節點並添加新的屬性節點：

for (i = 0; i < xLen; i++) { 
    newAtt = xmlDoc.createAttribute("edition");
    newAtt.value = "第一版";
    x[i].setAttributeNode(newAtt);
}

親自試試

如果該屬性已存在，則將其替換為新屬性。

使用 setAttribute() 創建屬性

由於 setAttribute() 方法會在屬性不存在時創建新屬性，因此它也可用於創建新屬性。

ตัวอย่าง 1

xmlDoc.getElementsByTagName('book')[0].setAttribute("edition","first");

親自試試

การอธิบายตัวอย่าง:

  1. จะได้เรียกเข้ามาที่ books.xml แล้ว xmlDoc ใน
  2. 將第一個 <book> 節點的 "edition" 屬性的值設置為 "first"

ตัวอย่าง 2

循環遍歷所有 <title> 節點並添加新屬性：

for(i = 0; i < x.length; i++) {
    x[i].setAttribute("edition", "第一版");
}

親自試試

創建文本節點

createTextNode() 方法創建新的文本節點：

ตัวอย่าง 1

newEle = xmlDoc.createElement("edition");
newText = xmlDoc.createTextNode("first");
newEle.appendChild(newText);
xmlDoc.getElementsByTagName("book")[0].appendChild(newEle);

親自試試

การอธิบายตัวอย่าง:

  1. จะได้เรียกเข้ามาที่ books.xml แล้ว xmlDoc ใน
  2. สร้างอิเล็มนต์ใหม่ <edition>
  3. สร้างความเห็นเมาท์ใหม่ที่มีข้อความ "first"
  4. เพิ่มความเห็นเมาท์ใหม่ไปที่อิเล็มนต์ใหม่
  5. เพิ่มอิเล็มนต์ใหม่ไปที่อิเล็มนต์ <book> แรก

ตัวอย่าง 2

เพิ่มอิเล็มนต์ที่มีตัวอักษรในอิเล็มนต์ <book> ทั้งหมด:

for (i = 0; i < xLen; i++) { 
    newEle = xmlDoc.createElement("edition");
    newText = xmlDoc.createTextNode("第一版");
    newEle.appendChild(newText);
    x[i].appendChild(newEle);
}

親自試試

สร้างความเห็นเมาท์ CDATA Section

createCDATASection() วิธีสร้างความเห็นเมาท์ CDATA section ใหม่

ตัวอย่าง 1

newCDATA = xmlDoc.createCDATASection("新年特惠 & 限时折扣");
xmlDoc.getElementsByTagName("book")[0].appendChild(newCDATA);

親自試試

การอธิบายตัวอย่าง:

  1. จะได้เรียกเข้ามาที่ books.xml แล้ว xmlDoc ใน
  2. สร้างความเห็นเมาท์ CDATA section ใหม่
  3. เพิ่มความเห็นเมาท์ CDATA ใหม่ไปที่อิเล็มนต์ <book> แรก

ตัวอย่าง 2

วนรอบและเพิ่มเนื้อหา CDATA ที่มีอยู่ในหลักข้อมูลทั้งหมด <book> อิเล็มนต์:

x = xmlDoc.getElementsByTagName("book");
xLen = x.length;
newtext = "新年特惠 & 限时折扣";
for (i = 0; i < xLen; i++) { 
    newCDATA = xmlDoc.createCDATASection(newtext);
    x[i].appendChild(newCDATA);
}

親自試試

สร้างความเห็นเมาท์

createComment() วิธีสร้างความเห็นเมาท์ใหม่

ตัวอย่าง 1

newComment = xmlDoc.createComment("2024 年 2 月修訂");
xmlDoc.getElementsByTagName("book")[0].appendChild(newComment);

親自試試

การอธิบายตัวอย่าง:

  1. จะได้เรียกเข้ามาที่ books.xml แล้ว xmlDoc ใน
  2. สร้างความเห็นเมาท์ใหม่
  3. เพิ่มความเห็นเมาท์ใหม่ไปที่อิเล็มนต์ <book> แรก

ตัวอย่าง 2

วนรอบและเพิ่มความเห็นเมาท์ที่มีอยู่ในหลักข้อมูลทั้งหมด <book> อิเล็มนต์:

x = xmlDoc.getElementsByTagName("book");
xLen = x.length
for (i = 0; i < xLen; i++) { 
    newComment = xmlDoc.createComment("2024 年 2 月修訂");
    x[i].appendChild(newComment);
}

親自試試