ซีเลคเตอร์ has
ซีเลคเตอร์ :has จะเลือกองค์ประกอบ
ที่มีอย่างน้อยหนึ่งองค์ประกอบภายใน
ตามซีเลคเตอร์ที่กำหนด ไม่จำเป็นต้องเป็น
ลูกโดยตรง
เนื่องจาก :has ไม่ได้อยู่ในข้อกำหนด CSS
เพื่อเพิ่มประสิทธิภาพในเบราว์เซอร์สมัยใหม่
ควรใช้
$("CSS selector ของคุณ").has(selector/DOM element) แทน
ไวยากรณ์
นี่คือวิธีเลือกองค์ประกอบ:
$(':has(selector)');
นี่คือวิธีเลือกองค์ประกอบ หากต้องการให้ ซีเลคเตอร์ซ้อนกันโดยตรง:
$(':has(>selector)');
ตัวอย่าง
มาเลือกเฉพาะย่อหน้าที่มี
แท็ก b อยู่ภายใน
และเพิ่มข้อความ '!!!' ที่ส่วนท้าย:
<p>text</p>
<p>text</p>
<p><b>bold</b> text</p>
<p><b>bold</b> text</p>
$('p:has(b)').append('!!!');
โค้ด HTML จะกลายเป็นดังนี้:
<p>text</p>
<p>text</p>
<p><b>bold</b> text!!!</p>
<p><b>bold</b> text!!!</p>
