কোনও উপাদানটির jQuery সহ সিএসএস শ্রেণি রয়েছে কিনা তা নির্ধারণ করুন


173

আমি jQuery এর সাথে কাজ করছি এবং এটির সাথে কোনও নির্দিষ্ট সিএসএস শ্রেণি যুক্ত আছে কিনা তা নির্ধারণ করার কোনও সহজ উপায় আছে কিনা তা সন্ধান করছি।

আমার কাছে উপাদানটির আইডি এবং আমি যে সিএসএস ক্লাসটি সন্ধান করছি have আমি শুধু সক্ষম হতে হবে, যদি একটি বিবৃতিতে, উপাদান উপর শ্রেণীর অস্তিত্বের উপর ভিত্তি করে একটি তুলনা করতে।


1
আপনি যদি jQuery ছাড়াই এটি করতে চান তবে জাভাস্ক্রিপ্ট সহ "হ্যাশ ক্লাস"?
ওরিওল

উত্তর:


237

hasClassপদ্ধতিটি ব্যবহার করুন :

jQueryCollection.hasClass(className);

অথবা

$(selector).hasClass(className);

আর্গুমেন্টটি (স্পষ্টতই) আপনি যা যা পরীক্ষা করছেন তার প্রতিনিধিত্বকারী একটি স্ট্রিং এবং এটি একটি বুলিয়ান দেয় (সুতরাং এটি বেশিরভাগ jQuery পদ্ধতির মতো শৃঙ্খলা সমর্থন করে না)।

দ্রষ্টব্য: আপনি যদি classNameএমন একটি যুক্তি পাস করেন যা শ্বেতস্পেস থাকে তবে এটি সংগ্রহের উপাদানগুলির classNameস্ট্রিংয়ের সাথে অক্ষরে অক্ষরে মিলবে । সুতরাং, উদাহরণস্বরূপ, যদি আপনার একটি উপাদান থাকে,

<span class="foo bar" />

তাহলে এটি ফিরে আসবে true:

$('span').hasClass('foo bar')

এবং এগুলি ফিরে আসবে false:

$('span').hasClass('bar foo')
$('span').hasClass('foo  bar')

4
আমি একমত নই ডকুমেন্টেশনটি বিভাগগুলির অধীনে সংগঠিত, তবে আপনি বর্ণানুক্রমিকভাবে সমস্ত পদ্ধতিও দেখতে পারেন। সবকিছু একটি উদাহরণ সহ আসে এবং মন্তব্য বিভাগটি সাধারণত যা কিছু বাদ যায় তা পরিষ্কার করে দেয়। jQuery এর প্রচুর দুর্দান্ত ফাংশন এবং ইউটিলিটি রয়েছে এবং সেগুলি আবিষ্কার করতে কিছুটা শেখার দরকার পড়ে। -ডিআইটি- এটি বোধগম্য হয়, এটি অবশ্যই অনেক দূর এগিয়েছে।
ট্রাফালমডোরিয়ান

1
@ ট্রাফালমডোরিয়ান, আমি আমার মূল মন্তব্যটি সরিয়েছি কারণ পরিস্থিতি বদলে গেছে। মূলত আপনি সবকিছু -ইডিআইটি-এর আগে পোস্ট করেছিলেন এবং আমি জবাব দিয়েছি যে ডকুমেন্টেশনের গুণমান সম্পর্কে আমার মন্তব্যটি আর প্রাসঙ্গিক নয় তবে তাদের পূর্ববর্তী (মিডিয়াউইকি) সিস্টেমে উল্লেখ করা হয়েছে। তারপরে আপনি আপনার আগের মন্তব্যটি মুছলেন এবং -ডিআইটি- দিয়ে পোস্ট করেছেন। আমি আশা করি যে এই ক্লিনআপটি ভবিষ্যতের পাঠকদের জন্য আরও পরিষ্কার এবং কম বিভ্রান্তিকর।
চোখের পলকহীনতা

@ এডানিলোকুইও, আপনি যদি সরাসরি api.jquery.com এ যান ... কোনও কারণে ওয়েবসাইটটি এখনও ডকস.জকুরি
ডট

21

এফএকিউ থেকে

elem = $("#elemid");
if (elem.is (".class")) {
   // whatever
}

বা:

elem = $("#elemid");
if (elem.hasClass ("class")) {
   // whatever
}

3
.is () থেকে সতর্ক থাকুন - "jQuery মধ্যে আছে () পদ্ধতি সত্য ফিরে আসবে যদি ভিত্তিক সংগ্রহে উপাদানের কোনো বর্তমান সংগ্রহে ম্যাচে উপাদানের কোন" - bennadel.com/blog/...
জ্যাক

11

প্রত্যাখ্যান হিসাবে, যদি আপনি জানতে চান যে কোনও উপাদানটির কোনও শ্রেণি নেই তবে আপনি মার্ক হিসাবে বলেছিলেন কেবল তা করতে পারেন।

if (!currentPage.parent().hasClass('home')) { do what you want }

3

JQuery ছাড়া:

var hasclass=!!(' '+elem.className+' ').indexOf(' check_class ')+1;

বা:

function hasClass(e,c){
    return e&&(e instanceof HTMLElement)&&!!((' '+e.className+' ').indexOf(' '+c+' ')+1);
}
/*example of usage*/
var has_class_medium=hasClass(document.getElementsByTagName('input')[0],'medium');

এটি jQuery এর চেয়ে দ্রুত!


কেন আপনি না ...&&!!((' '+e.classname+' ').indexOf(' '+c+' ')+1), এবং না &&!(' '+e.classname+' ').indexOf(' '+c+' ')?
Blexy

1
কারণ indexOfরিটার্ন -1ক্লাসের অস্তিত্ব নেই। আমি যদি করি !!-1তবে তা হবে true। যেহেতু আমি করছি !!-1+1, এটি মিথ্যা হবে। আরও ভাল উপায় হতে পারে ...&&!!~(' '+e.className+' ').indexOf(' '+c+' '), কিন্তু আমি মনে করি না।
ইসমাইল মিগুয়েল

দুঃখিত, আমি বোঝাতে চেয়েছি...&&~(' '+e.className+' ').indexOf(' '+c+' ')
ইসমাইল মিগুয়েল

3

যে কেউ এখানে অবতরণ করেছে তবে প্রকৃতপক্ষে এটি করার জন্য jQuery মুক্ত উপায়ের সন্ধান করছে:

element.classList.contains('your-class-name')


0
 $('.segment-name').click(function () {
    if($(this).hasClass('segment-a')){
        //class exist
    }
});

0

আমার ক্ষেত্রে, আমি 'ইজ' একটি জিকুয়েরি ফাংশন ব্যবহার করেছি, আমার মধ্যে বিভিন্ন সিএসএস ক্লাস যুক্ত একটি এইচটিএমএল উপাদান যুক্ত ছিল, আমি এইগুলির মধ্যে একটি নির্দিষ্ট শ্রেণির সন্ধান করছিলাম, তাই আমি "এই" ব্যবহার করেছি যাচাই করার জন্য একটি ভাল বিকল্প একটি এইচটিএমএল উপাদানটিতে গতিশীলভাবে যুক্ত একটি বর্গ, যার মধ্যে ইতিমধ্যে অন্যান্য সিএসএস ক্লাস রয়েছে, এটি অন্য একটি ভাল বিকল্প।

সাধারণ উদাহরণ:

 <!--element html-->
 <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

 <!--jQuery "is"-->
 $('#menu').is('.cbp-spmenu-open');

উন্নত উদাহরণ:

 <!--element html-->
    <nav class="cbp-spmenu cbp-spmenu-horizontal cbp-spmenu-bottom cbp-spmenu-open" id="menu">somethings here... </nav>

   <!--jQuery "is"-->
    if($('#menu').is('.cbp-spmenu-bottom.cbp-spmenu-open')){
       $("#menu").show();
    }
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.