Cara menggunakan previouselementsibling javascript

Nội dung chính Show

Definisi dan Penggunaan
Dukungan Browser
Sintaksis
Rincian teknis

Contoh

Dapatkan konten HTML dari saudara sebelumnya item daftar:

var x = document.getElementById("item2").previousElementSibling.innerHTML;

Hasil x akan:

Coffee (first li)

Cobalah sendiri "

Definisi dan Penggunaan

Properti previousElementSibling mengembalikan elemen sebelumnya dari elemen tertentu, di tingkat pohon yang sama.

Perbedaan antara properti ini dan previousSibling , adalah bahwa previousSibling mengembalikan simpul saudara sebelumnya sebagai simpul elemen, node teks atau komentar node, sedangkan previousElementSibling mengembalikan saudara simpul sebelumnya sebagai simpul elemen (ignores text and comment nodes) .

Properti ini adalah read-only.

Tip: Gunakan nextElementSibling properti untuk kembali elemen berikutnya dari elemen tertentu.

Tip: Gunakan anak properti untuk kembali setiap elemen anak dari elemen tertentu.

Dukungan Browser

Milik
previousElementSibling	2.0	9.0	3,5	4.0	10,0

Sintaksis

node .previousElementSibling

Rincian teknis

Kembali Nilai:	Sebuah objek Node, mewakili saudara sebelumnya elemen, atau null jika tidak ada saudara sebelumnya
DOM Versi	Inti Level 3 Elemen Traversal

View Discussion

Improve Article

Save Article

Read

Discuss

View Discussion

Improve Article

Save Article

The previousElementSibling property in HTML DOM is used to return the previous element of the same level of the given element. If no previous element found on the same level then it returns null. It is a read-only property. It is similar to previousSibling property but the difference is previousSibling property returns the previous sibling node as an element node, a text node or a comment node, while previousElementSibling property returns the previous sibling as an element node.

Syntax:

node.previousElementSibling

Return value: This property returns a previous sibling of the specified element or null if the current element has no previous sibling.

Example:

<html>

<head>

<title>

HTML DOM previousElementSibling Property

title>

head>

<body>

<h2>

DOM previousElementSibling Property

h2>

<h4 id = "h42">Web Languages:h4>

<select size = "4">

<option>HTMLoption>

<option>CSSoption>

<option>JavaScriptoption>

<option id = "Select">XMLoption>

select>

<br><br>

<button onclick = "Geeks()">

Previous Element Sibling

button>

<br><br>

<p id = "p">p>

<script>

function Geeks() {

var a =

document.getElementById("Select").previousElementSibling;

document.getElementById("p").innerHTML = a.text;

}

script>

body>

html>


Output:
Before click on the button:

After click on the button:
Note: Don’t use white space between two sibling elements, otherwise, the result will be “undefined”.
Supported
Browsers: The browser supported by DOM previousElementSibling property are listed below:
Google Chrome 2.0
Internet Explorer 9.0
Firefox 3.5
Opera 10.0
Safari 4.0