jQuery ทางค้นหา - method offsetParent()

jQuery ทางค้นหาคู่มือ

ตัวอย่าง

ตั้งสี background ขององค์ประกอบที่มีการจัดตำแหน่งใกล้ที่สุดของ element li ที่มีค่า class ให้เป็น item-a

$('li.item-a').offsetParent().css('background-color', 'red');

ลองทดสอบด้วยตัวเอง

คำนิยามและการใช้งาน

offsetParent() ได้แก่องค์ประกอบเดิมที่มีการจัดตำแหน่งใกล้ที่สุด

เขียนโฉม

.offsetParent();

รายละเอียด

ถ้ามี jQuery object ที่แสดงคลองสมาชิก DOM มี .offsetParent() method อนุญาตให้เราค้นหาประโยชน์ในองค์ประกอบเดิมของต้นโครงสร้าง DOM และทำ jQuery object ที่ถูกเข้ารอบโดยองค์ประกอบที่มีการจัดตำแหน่งใกล้ที่สุด องค์ประกอบที่มีการจัดตำแหน่งคือ องค์ประกอบที่มี CSS position จัดให้เป็น relative, absolute หรือ fixed ในขณะที่คำนวณ offset ของ animation หรือจัดตำแหน่งวัตถุบนหน้าเว็บ ข้อมูลนี้จะมีประโยชน์มาก

โปรดคิดถึงหน้าเว็บที่มีรายการลิสต์ซับซ้อนพื้นฐานและมีองค์ประกอบที่มีการจัดตำแหน่ง:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii" style="position: relative;">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">
          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>
      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

หากเราเริ่มจากโครงสร้าง A สามารถหาองค์ประกอบที่มีการจัดตำแหน่งตามลำดับเดิมได้:

$('li.item-a');.offsetParent();.css('background-color', 'red');

ลองทดสอบด้วยตัวเอง

นี่จะเปลี่ยนสี background ของโครงสร้างที่ถูกกำหนดเป็น red

jQuery ทางค้นหาคู่มือ