คุณสมบัติ previousElementSibling

คุณสมบัติ previousElementSibling มี เอลิเมนต์ก่อนหน้า ที่อยู่ใน parent เดียวกัน ถ้าไม่มีเอลิเมนต์ดังกล่าว จะคืนค่า null

ไวยากรณ์

javascriptelement.previousElementSibling;

ตัวอย่าง

กำหนดเอลิเมนต์ #elem มาแสดง ข้อความของเอลิเมนต์ข้างเคียงด้านบนของมัน:

html<p>sibling</p>
<p id="elem">elem</p>
javascriptlet elem = document.querySelector('#elem');
let text = elem.previousElementSibling.textContent;

console.log(text);

ผลลัพธ์จากการเรียกใช้โค้ด:

javascript'sibling'

ตัวอย่าง

หากไม่มีเอลิเมนต์ข้างเคียงด้านบน หรือมันอยู่ ไม่ใช่ใน parent เดียวกันกับเอลิเมนต์ของเรา ก็จะคืนค่า null เช่นกัน:

html<p>sibling</p>
<div>
  <p id="elem">elem</p>
</div>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.previousElementSibling);

ผลลัพธ์จากการเรียกใช้โค้ด:

javascriptnull

ดูเพิ่มเติม

  • คุณสมบัติ nextElementSibling,
    ซึ่งมีเอลิเมนต์ข้างเคียงด้านล่าง (เอลิเมนต์ถัดไป)