HTML DOM Element ก่อนหน้า ElementSibling Property ใน JavaScript คืออะไร

โพสต์นี้จะอธิบายองค์ประกอบ HTML DOM คุณสมบัติ “previousElementSibling” โดยใช้ JavaScript

องค์ประกอบ HTML DOM คุณสมบัติ “previousElementSibling” คืออะไร

องค์ประกอบ DOM (Document Object Model) “ ElementSibling ก่อนหน้า ” เป็นคุณสมบัติแบบอ่านอย่างเดียวที่ช่วยในการดึงข้อมูลพี่น้องก่อนหน้าขององค์ประกอบในทรีเดียวกัน คุณสมบัตินี้ส่งคืนเนื้อหาของพี่น้องก่อนหน้า

ไวยากรณ์

ไวยากรณ์นี้คืนค่า “ สตริง ” ที่มีเนื้อหา HTML ของพี่น้องก่อนหน้า และ “ โมฆะ “ถ้ามันไม่มี.

ลองใช้ไวยากรณ์ที่กำหนดไว้ข้างต้นในทางปฏิบัติเพื่อแสดงการทำงานของคุณสมบัติ 'องค์ประกอบก่อนหน้า'

ตัวอย่าง: การใช้คุณสมบัติ “previousElementSibling” เพื่อส่งคืนเนื้อหาของพี่น้องคนก่อน

ตัวอย่างนี้ใช้คุณสมบัติ 'previousElementSibling' ของ JavaScript เพื่อรับเนื้อหา HTML ของพี่น้องก่อนหน้า

รหัส HTML

ขั้นแรก ภาพรวมของรหัส HTML ต่อไปนี้:

ในบรรทัดรหัสด้านบน:

• “
  ” แท็กเพิ่มรายการที่ไม่มีลำดับ
  • ภายในรายการที่ไม่เรียงลำดับ รายการหลายรายการจะถูกฝังไว้โดยใช้ ' <นั่น> ” แท็กด้วยรหัสที่กำหนด
  • สุดท้ายนี้ “

    ” แท็กฝังย่อหน้าว่างด้วย id เฉพาะ “para”

  รหัสจาวาสคริปต์

  ตอนนี้ดำเนินการต่อด้วยรหัส JavaScript:

  < สคริปต์ >
  ปล่อยให้รายการ = เอกสาร. getElementById ( 'ที่สาม' ) . ElementSibling ก่อนหน้า . HTML ภายใน ;
  เอกสาร. getElementById ( 'สำหรับ' ) . HTML ภายใน = ' พี่น้องก่อนหน้าของรายการที่สามคือ : ' + รายการ ;
  สคริปต์ >

  ตามข้อมูลโค้ดด้านบน:

  • ตัวแปร “item” จะใช้ “ getElementById() ” วิธีการเข้าถึงรายการเป้าหมายโดยใช้รหัส 'ที่สาม' จากนั้นใช้ ' ElementSibling ก่อนหน้า ” คุณสมบัติที่จะได้รับก่อนหน้าพี่น้อง
  • หลังจากนั้น “ getElementById() ” วิธีการเข้าถึงย่อหน้าว่างที่เพิ่มโดยใช้ id “para” เพื่อต่อท้ายด้วยค่าของตัวแปร “item” เช่น พี่น้องก่อนหน้า

  เอาต์พุต

  

  ดังที่เห็น ผลลัพธ์แสดงพี่น้องก่อนหน้าของรายการเป้าหมาย เช่น (JavaScript)

  บทสรุป

  JavaScript ให้องค์ประกอบ DOM ที่กำหนดไว้ล่วงหน้า “ ElementSibling ก่อนหน้า คุณสมบัติ ” เพื่อดึงพี่น้องก่อนหน้าขององค์ประกอบ จะส่งคืนพี่น้องก่อนหน้าขององค์ประกอบจากระดับต้นไม้เดียวกันกับที่องค์ประกอบเป้าหมายอยู่ โพสต์นี้อธิบายอย่างละเอียดเกี่ยวกับองค์ประกอบ HTML DOM คุณสมบัติ “previousElementSibling” ใน JavaScript