javascript - আমি কিভাবে jQuery এ একাধিক ক্লাস সঙ্গে একটি উপাদান নির্বাচন করতে পারেন?

css-selectors jquery-selectors (8)

আমি সব উপাদান নির্বাচন করতে চান যা দুটি শ্রেণী b এবং b ।

<element class="a b">

সুতরাং, শুধুমাত্র দুটি উপাদান আছে উপাদান।

যখন আমি $(".a, .b") ব্যবহার করি তখন এটি আমাকে ইউনিয়ন দেয়, তবে আমি ছেদটি চাই।

আপনার সমস্যা হচ্ছে, আপনি একটি Group Selector ব্যবহার করছেন, যখন আপনি একটি Multiples selector ব্যবহার করা উচিত! আরো নির্দিষ্ট হতে, আপনি $('.a, .b') ব্যবহার করছেন এবং আপনি $('.a.b') ব্যবহার করা উচিত।

আরো তথ্যের জন্য, এখানে selectors একত্রিত বিভিন্ন উপায়ে সংক্ষিপ্ত বিবরণ দেখুন!

গ্রুপ নির্বাচক: ","

সমস্ত <h1> উপাদানগুলি এবং সমস্ত <p> উপাদানগুলি এবং সমস্ত <a> উপাদানগুলি নির্বাচন করুন:

$('h1, p, a')

গুণক নির্বাচক: "" (কোন চরিত্র)

ক্লাস code এবং red সহ সকল <input> type text উপাদানগুলি নির্বাচন করুন:

$('input[type="text"].code.red')

Descendant নির্বাচক: "" (স্থান)

সমস্ত <i> উপাদান <i> উপাদানগুলির ভিতরে উপাদানগুলি নির্বাচন করুন:

$('p i')

শিশু নির্বাচক: ">"

সমস্ত <ul> উপাদানগুলি নির্বাচন করুন যা <li> উপাদানগুলির অবিলম্বে সন্তান:

$('li > ul')

নিকটাত্মীয় ভাইবোন নির্বাচক: "+"

<h2> উপাদানের পরে অবিলম্বে স্থাপন করা সমস্ত <a> উপাদান নির্বাচন করুন:

$('h2 + a')

জেনারেল সিবলিং নির্বাচকঃ "~"

<span> উপাদানের ভাইবোন যারা <span> উপাদানগুলি নির্বাচন করুন:

$('div ~ span')

আপনি filter() ফাংশন ব্যবহার করে এটি করতে পারেন:

$(".a").filter(".b")

আপনি যা চান তা পেতে getElementsByClassName() পদ্ধতিটি ব্যবহার করতে পারেন।

var elems = document.getElementsByClassName("a b c");
elems[0].style.color = "green";
console.log(elems[0]);

<ul>
  <li class="a">a</li>
  <li class="a b">a, b</li>
  <li class="a b c">a, b, c</li>
</ul>

এটি দ্রুততম সমাধান। আপনি here যে সম্পর্কে একটি বেঞ্চমার্ক দেখতে পারেন।

ক্ষেত্রে জন্য

<element class="a">
  <element class="b c">
  </element>
</element>

আপনি .bc এবং .bc মধ্যে একটি স্থান .bc

$('.a .b.c')

ভাল কর্মক্ষমতা জন্য আপনি ব্যবহার করতে পারেন

$('div.a.b')

এটি আপনার পৃষ্ঠায় থাকা সমস্ত HTML উপাদানগুলির মাধ্যমে পদক্ষেপ নেওয়ার পরিবর্তে কেবল ডিভ উপাদানগুলির মাধ্যমে দেখাবে।

ভ্যানিলা জাভাস্ক্রিপ্ট সমাধান: -

document.querySelectorAll('.a.b')

শুধু উপাদান সঙ্গে আরেকটি ক্ষেত্রে উল্লেখ:

যেমন <div id="title1" class="ABC">

শুধু টাইপ করুন: $("div#title1.ABC")

$('.a .b , .a .c').css('border', '2px solid yellow');
//selects b and c

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="a">a
  <div class="b">b</div>
  <div class="c">c</div>
  <div class="d">d</div>
</div>