has সিলেক্টর

:has সিলেক্টরটি এমন উপাদান নির্বাচন করে, যা নির্দিষ্ট সিলেক্টর অনুযায়ী অন্তত একটি উপাদান ধারণ করে, অগত্যা সরাসরি সন্তান নয়। যেহেতু :has CSS স্পেসিফিকেশনের অংশ নয়, তাই আধুনিক ব্রাউজারে更好的 পারফরম্যান্সের জন্য এর পরিবর্তে $("আপনার css-সিলেক্টর").has(সিলেক্টর/DOM উপাদান) ব্যবহার করা ভালো।

সিনট্যাক্স

আমরা এভাবে উপাদান নির্বাচন করি:

javascript$(':has(সিলেক্টর)');

যদি সিলেক্টরের জন্য সরাসরি নেস্টিং প্রয়োজন হয় তবে আমরা এভাবে উপাদান নির্বাচন করি:

javascript$(':has(>সিলেক্টর)');

উদাহরণ

আসুন শুধুমাত্র সেই অনুচ্ছেদগুলি নির্বাচন করি যার ভিতরে b ট্যাগ আছে এবং সেগুলির শেষে '!!!' টেক্সট যোগ করি:

html<p>টেক্সট</p>
<p>টেক্সট</p>
<p><b>বোল্ড</b> টেক্সট</p>
<p><b>বোল্ড</b> টেক্সট</p>

javascript$('p:has(b)').append('!!!');

HTML কোডটি এভাবে দেখাবে:

html<p>টেক্সট</p>
<p>টেক্সট</p>
<p><b>বোল্ড</b> টেক্সট!!!</p>
<p><b>বোল্ড</b> টেক্সট!!!</p>

আরও দেখুন