Native JavaScript menghapus instance kode elemen anak yang ditentukan:
Bab ini memperkenalkan cara menggunakan JavaScript asli untuk menghapus elemen anak yang ditentukan.
Semua orang tahu bahwa menggunakan jQuery untuk mengimplementasikan fungsi ini lebih nyaman, tetapi tidak merepotkan untuk menggunakan JavaScript asli. Izinkan saya memperkenalkannya di bawah ini.
Untuk bagaimana jQuery mengimplementasikan fungsi ini, silakan merujuk ke bab tentang penghapusan instance kode elemen anak yang ditentukan.
Contoh kode:
Salinan kode adalah sebagai berikut:
<! Doctype html>
<Html>
<meta charset = "UTF-8">
<title> wulin.com </title>
<tyle>
ul li {
Lebar: 400px;
Tinggi: 30px;
Line-Height: 30px;
List-style: tidak ada;
}
</tyle>
<script>
window.onload = function () {
var Obt = document.getElementById ("bt");
var obox = document.getElementById ("box");
var lis = obox.getElementsbyTagname ("li");
obt.onClick = function () {
obox.removechild (lis [1]);
}
}
</script>
</head>
<body>
<ul id = "box">
<li> Wulin.com menyambut Anda, hanya dengan bekerja keras, Anda dapat memiliki hari esok yang lebih baik. </li>
<li> Tidak ada seorang pun yang menjadi master sejak awal dan harus bekerja keras. </li>
<li> Setiap hari adalah waktu yang baru dan berharga. </li>
</ul>
<input type = "tombol" id = "bt" value = "view effect"/>
</body>
</html>
Kode di atas menerapkan persyaratan kami, dan berikut ini akan memperkenalkan proses implementasinya.
KOMENTAR KODE:
1.window.onload = function () {}, dan jalankan kode dalam fungsi setelah konten dokumen sepenuhnya dimuat.
2.Var Obt = Document.GetElementById ("BT"), dapatkan objek elemen tombol.
3.var obox = document.getElementById ("box"), dapatkan objek elemen dengan kotak nilai atribut ID.
4.var lis = obox.getElementsbyTagname ("li"), dapatkan set elemen li di bawah elemen kotak.
5.obt.onClick = function () {}, daftarkan fungsi klik event handler untuk tombol.
6.obox.removechild (lis [1]), hapus elemen anak yang ditentukan dari elemen induk.