DOM XML

Apa itu DOM?

DOM (Document Object Model) mendefinisikan standar untuk mengakses dan mengoperasikan dokumen:

“W3C Document Object Model (DOM) adalah sebuah antarmuka yang bebas platform dan bahasa, yang memungkinkan program dan skrip mengakses dan memperbarui konten, struktur, dan gaya dokumen secara dinamis.”

DOM HTML Mendefinisikan metode standar untuk mengakses dan mengoperasikan dokumen HTML. Ini akan mempresentasikan dokumen HTML dalam struktur pohon.

DOM XML Mendefinisikan metode standar untuk mengakses dan mengoperasikan dokumen XML. Ini akan mempresentasikan dokumen XML dalam struktur pohon.

Untuk pengembang yang menggunakan HTML atau XML, memahami DOM adalah penting.

DOM HTML

Semua elemen HTML dapat diakses melalui DOM HTML.

Contoh di bawah ini mengubah nilai id="demo" elemen HTML:

Contoh

<h1 id="demo">Ini judul</h1>
<button type="button" onclick="document.getElementById('demo').innerHTML = 'Hello World!'">
Klik saya!
</button>

亲自试一试

Anda dapat belajar tentang DOM HTML lebih banyak pengetahuan.

DOM XML

Semua elemen XML dapat diakses melalui DOM XML.

Books.xml

<?xml version="1.0" encoding="UTF-8"?>
<bookstore>
  <book category="美食">
    <title lang="zh">雅舍谈吃</title>
    <author>梁实秋</author>
    <year>2013</year>
    <price>35</price>
  </book>
  <book category="儿童">
    <title lang="zh">了不起的狐狸爸爸</title>
    <author>罗尔德·达尔</author>
    <year>2009</year>
    <price>10.00</price>
  </book>
</bookstore>

Kode ini mencari nilai teks elemen <title> pertama dalam dokumen XML:

Contoh

txt = xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

DOM XML adalah standar tentang bagaimana mengakses, mengubah, menambahkan, dan menghapus elemen XML.

Contoh ini akan memuat string teks ke objek DOM XML dan menggunakan JavaScript untuk mengekstrak informasi:

Contoh

<html>
<body>
<p id="demo"></p>
<script>
var text, parser, xmlDoc;
text = "<bookstore><book>"
"<title>雅舍谈吃</title>" +
"<author>梁实秋</author>" +
"<year>2009</year>" +
"</book></bookstore>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
</script>
</body>
</html>

亲自试一试

您将在我们的 XML DOM 教程中学习有关 DOM XML 的更多内容。