DOM tambah nod
XML DOM Tambah nod
Contoh di bawah menggunakan fail XML books.xml.
Fungsi loadXMLDoc(), terletak dalam JavaScript luaran, digunakan untuk memuatkan fail XML.
Tambahkan nod selepas nod anak terakhir
Contoh ini menggunakan kaedah appendChild() untuk menambah nod anak pada nod sedia ada.
Tambahkan nod sebelum nod anak yang ditentukan
Contoh ini menggunakan kaedah insertBefore() untuk memasukkan nod sebelum nod anak yang ditentukan.
Tambah atribut baharu
Contoh ini menggunakan kaedah setAttribute() untuk menambah atribut baharu.
Tambah data pada nod teks
Contoh ini menggunakan insertData() untuk memasukkan data ke dalam nod teks sedia ada.
Tambah nod - appendChild()
kaedah appendChild() menambah nod anak pada nod sedia ada.
Nod baharu ditambah (dilampirkan) selepas sebarang nod anak sedia ada.
Nota: Jika kedudukan nod adalah penting, gunakan kaedah insertBefore().
Coretan kod berikut mencipta elemen (<edisi>) dan menambahkannya selepas nod anak terakhir elemen <buku> pertama:
Contoh
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newel=xmlDoc.createElement("edition"); x=xmlDoc.getElementsByTagName("book")[0]; x.appendChild(newel); document.write(x.getElementsByTagName("edition")[0].nodeName); </script> </body> </html>
Jalankan contoh»
Klik butang "Jalankan contoh" untuk melihat contoh dalam talian
Penjelasan contoh:
Gunakan loadXMLDoc() untuk memuatkan "books.xml" ke dalam xmlDoc
Buat nod<edition>
Tambahkan nod ini pada elemen <book> pertama
Lintas dan tambahkan elemen pada semua <buku> cuba
Sisipkan nod - kaedah insertBefore()
insertBefore() digunakan untuk memasukkan nod sebelum nod anak yang ditentukan.
Kaedah ini berguna apabila kedudukan nod tambahan adalah penting:
Instance
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); newNode=xmlDoc.createElement("book"); x=xmlDoc.documentElement; y=xmlDoc.getElementsByTagName("book"); document.write("Book elements before: " + y.length); document.write("<br>"); x.insertBefore(newNode,y[3]); y=xmlDoc.getElementsByTagName("book"); document.write("Book elements after: " + y.length); </script> </body> </html>
Jalankan instance »
Klik butang "Jalankan Instance" untuk melihat contoh dalam talian
Penjelasan contoh:
Gunakan loadXMLDoc() untuk memuatkan "books.xml" ke dalam xmlDoc
Buat nod elemen baharu < ;book>
Masukkan nod baharu ini sebelum <buku> nod elemen terakhir
Jika nod kedua insertBefore() Jika yang pertama parameter adalah batal, nod baharu akan ditambah selepas nod anak sedia ada yang terakhir.
x.insertBefore(newNode,null) dan x.appendChild(newNode) boleh menambahkan nod anak baharu pada x.
Tambah atribut baharu
addAtribute() Kaedah ini tidak wujud.
Jika atribut tidak wujud, setAttribute() boleh mencipta atribut baharu:
Instance
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title"); x[0].setAttribute("edition","first"); document.write("Edition: "); document.write(x[0].getAttribute("edition")); </script> </body> </html>
Jalankan contoh »
Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian
Penjelasan contoh:
Gunakan loadXMLDoc() untuk memuatkan "books.xml" Muatkan xmlDoc
dan tetapkan (buat) nilai atribut "edisi" bagi elemen <book> pertama kepada "first"
Nota: Jika atribut sudah wujud, kaedah setAttribute() akan menimpa nilai sedia ada.
Tambah teks pada nod teks - kaedah insertData()
insertData() memasukkan data ke dalam nod teks sedia ada. Kaedah
insertData() mempunyai dua parameter:
offset - tempat untuk mula memasukkan aksara (bermula dengan 0)
rentetan - Rentetan untuk disisipkan
Coretan kod berikut akan menambah "Mudah" pada nod teks <tajuk> pertama bagi XML yang dimuatkan:
Instance
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]; document.write(x.nodeValue); x.insertData(0,"Easy "); document.write("<br>"); document.write(x.nodeValue); </script> </body> </html>
Run Instance»
Klik butang "Run Instance" untuk melihat instance dalam talian