Mengembalikan Node Sebelumnya HTML Menggunakan previousSibling DOM
Properti previousSibling DOM pada HTML digunakan untuk mengembalikan node sebelumnya dari node spesifik sebagai node object atau nilai null, jika node spesifik merupakan node yang terdapat pada daftar pertama yang bersifat read-only.
Sintak:
node.previousSibling
Return Values: properti previousSibling berfungsi untuk mengembalikan previous sibling dari node spesifik atau null, jika node saat ini tidak memiliki previous sibling.
Contoh:
 |
| Properti previousSibling DOM |
Sebelum memahami lebih dalam materi tentang Mengembalikan Node Sebelumnya HTML Menggunakan previousSibling DOM, terlebih dahulu pelajari materi tentang: Mengatur Nilai Elemen Parent HTML Menggunakan parentElement DOM [klik], Mendapatkan Node Parent HTML Menggunakan parentNode DOM [klik], dan Mengembalikan Kepemilikan Dokumen HTML ownerDocument DOM [klik].
node.previousSibling
Baca Juga:
Contoh:
<html>
<head>
<title>
Properti previousSibling DOM
</title>
</head>
<body style = "text-align: center">
<h1 style = "color:green">
Blog Elfan
</h1>
<h2>
Properti previousSibling DOM
</h2>
<div>
<span id="p1">
Blog TIK!
</span>
<span id="p2">
Merupakan portal ilmu
komputer.
</span>
</div>
<br>
<button onclick="bonn()">
Klik Disini!
</button>
<br><br>
<p
id="p"
style = "margin:auto; width: 40%">
</p>
<!-- Fungsi untuk
mengembalikan node
sebelumnya -->
<script>
function bonn()
{
var x =
document.getElementById("p2").previousSibling.innerHTML;
document.getElementById("p").innerHTML = x;
document.getElementById("p").style.color = "white";
document.getElementById("p").style.background = "green";
}
</script>
</body>
</html>
Output:Blog Elfan
Properti previousSibling DOM
Blog TIK! Merupakan portal ilmu komputer.
Catatan: letakkan spasi kosong diantar dua elemen sibling, jika tidak maka hasilnya adalah "undefined" atau tidak terdefinisi.
Referensi Tambahan:
- Cara Penggunaan Method removeChild() DOM HTML [klik]
- 2 Parameter Method replaceChild() DOM pada HTML [klik]
- Cara Penggunaan Properti scrollHeight DOM pada HTML [klik]
- 2 Contoh Penggunaan Properti scrollLeft DOM pada HTML [klik]
- 2 Contoh Penggunaan Properti scrollTop DOM pada HTML [klik]
- Cara Penggunaan Properti scrollWidth DOM pada HTML [klik]
- Cara Penggunaan Method setAttributeNode() DOM pada HTML [klik]
Artikel ini didedikasikan kepada: Maersa Azahra Nabila, Mahadewi Rana Botsairbah, Mega Isabella Wulandari, Meira Pradipta Putri, dan Meliza Haryani.
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti previousSibling DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti previousSibling DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa fungsi method previousSibling DOM pada HTML?
BalasHapusProperti previousSibling DOM pada HTML berfungsi untuk mengembalikan node sebelumnya pada tree level yang sama, dimana nilai yang dikembalikan adalah berupa object node.
HapusProperti previousSibling berfungsi untuk mengembalikan node sebelumnya yang berada dalam bentuk node elemen, node teks, atau node komentar. Properti previousSibling DOM pada HTML merujuk pada teks spasi pada elemen sebenarnya yang ingin didapatkan oleh user.
HapusCatatan: Spasi yang terdapat diantara elemen juga merupakan bentuk node teks.