জেকুয়েরি জাভাস্ক্রিপ্ট এঙ্গুলার এইচটিএমএল সিএসএস বুটস্ট্রাপ
ফোরাম
 

জেকুয়েরি [attribute|=value] সিলেক্টর


« জেকুয়েরি সিলেক্টরসমূহ



সংজ্ঞা এবং ব্যবহার

[attribute|=value] সিলেক্টরের মাধ্যমে নির্দিষ্ট এট্রিবিউটযুক্ত এলিমেন্টকে সিলেক্ট করা হয়, এবং এট্রিবিউটের নির্দিষ্ট স্ট্রিং ভ্যালুওযুক্ত(যেমন "en") অথবা পরে একটি হাইফেনযুক্ত শব্দ দিয়ে শুরু হয়(যেমন "en-us")।


পরামর্শঃ এই সিলেক্টরটি প্রায়ই language এট্রিবিউটের ক্ষেত্রে ব্যবহার করা হয়।



সিনট্যাক্স

$("[attribute|='value']")


প্যারামিটার ও তাদের ভ্যালু

নিচের টেবিলে [attribute|=value] সিলেক্টরে ব্যবহৃত প্যারামিটার এবং প্যারামিটারের সম্ভাব্য ভ্যালু গুলো দেখানো হলোঃ

প্যারামিটার বিবরণ
attribute আবশ্যক। যেই এট্রিবিউট খুজে বের করা হবে সেটিকে নির্দেশ করে।
value আবশ্যক। এট্রিবিউটের স্ট্রিং ভ্যালু যে শব্দ দিয়ে শুরু হয়, তা নির্দেশ করে।


[attribute|=value] সিলেক্টর সংক্রান্ত উদাহরণ

যেসকল <p> এলিমেন্টের title এট্রিবিউটের ভ্যালু "para" শব্দ দিয়ে শুরু হয়, সেগুলোকে সিলেক্ট

নিচের উদাহরণে [attribute|=value] সিলেক্টরের ব্যবহার দেখানো হলোঃ

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
  <title>জেকুয়েরি [attribute|=value] সিলেক্টর</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script>
  $(document).ready(function(){
    $("p[title|='para']").css({
        "background-color": "green",
        "color": "white",
    });
  });
  </script>
</head>
<body>

  <p title="para">এটি একটি প্যারগ্রাফ।</p>
  <p title="paragraph">এটি একটি প্যারগ্রাফ।</p>
  <p title="paragraph">এটি একটি প্যারগ্রাফ।</p>
  <p title="para-graph">এটি একটি প্যারগ্রাফ।</p>

</body>
</html>

এই সিলেক্টর ঐসকল এলিমেন্টকে সিলেক্ট করে, যেগুলোর title এট্রিবিউটের ভ্যালু 'para', অথবা 'para' দিয়ে শুরু হইয়ে পরে হাইফেন থাকবে।

ফলাফল





language এট্রিবিউটের ক্ষেত্রে

নিচের উদাহরনে hreflang এট্রিবিউটযুক্ত সকল <a> এলিমেন্টকে সিলেক্ট করে, যেখানে এট্রিবিউটের ভ্যালু "en" অথবা "en" দিয়ে শুরু হয়ঃ

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
  <title>জেকুয়েরি [attribute|=value] সিলেক্টর</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script>
  $(document).ready(function(){
    $("a[hreflang|='en']").css({
        "background-color": "yellow",
        "color": "red",
    });
  });
  </script>
</head>
<body>

  <a href="https://sattacademy.com" hreflang="en">sattacademy.com</a><br>
  <a href="https://sattacademy.com" hreflang="en-us">sattacademy.com</a><br>
  <a href="https://sattacademy.com" hreflang="us-en">sattacademy.com</a><br>
  <a href="https://sattacademy.com" hreflang="fr">sattacademy.com</a>

</body>
</html>

এই সিলেক্টর "en" এবং "en-us" উভয়কেই সিলেক্ট করবে।

ফলাফল





« জেকুয়েরি সিলেক্টরসমূহ