jQuery: Sprawdź, czy istnieje div z pewną nazwą klasy

Za pomocą jQuery programowo generuję kilka divtakich:

<div class="mydivclass" id="myid1">Some Text1</div>
<div class="mydivclass" id="myid2">Some Text2</div>

Gdzie indziej w moim kodzie muszę sprawdzić, czy te DIV istnieją. Nazwa klasy dla div jest taka sama, ale ID zmienia się dla każdego div. Masz pomysł, jak je wykryć za pomocą jQuery?

Możesz to uprościć, sprawdzając pierwszy obiekt zwracany z JQuery w następujący sposób:

if ($(".mydivclass")[0]){
    // Do something if class exists
} else {
    // Do something if class does not exist
}

W takim przypadku, jeśli w pierwszym ( [0]) indeksie istnieje prawdziwa wartość , to załóżmy, że istnieje klasa.

Edytuj 04/10/2013: Utworzyłem tutaj przypadek testowy jsperf .

Możesz użyć size(), ale jQuery zaleca użycie długości, aby uniknąć narzutu wywołania innej funkcji:

$('div.mydivclass').length

Więc:

// since length is zero, it evaluates to false
if ($('div.mydivclass').length) {

http://api.jquery.com/size/

http://api.jquery.com/length/

AKTUALIZACJA

Wybrana odpowiedź korzysta z testu perf, ale jest nieco wadliwa, ponieważ obejmuje również wybór elementu jako część perf, co nie jest tutaj testowane. Oto zaktualizowany test perf:

http://jsperf.com/check-if-div-exists/3

Moje pierwsze uruchomienie testu pokazuje, że pobieranie właściwości jest szybsze niż pobieranie indeksu, chociaż IMO jest dość znikome. Nadal wolę używać długości, ponieważ bardziej sensowne jest przeznaczenie kodu zamiast bardziej zwięzłego warunku.

Bez jQuery:

Natywny JavaScript zawsze będzie szybszy. W takim przypadku: (przykład)

if (document.querySelector('.mydivclass') !== null) {
    // .. it exists
}

Jeśli chcesz sprawdzić, czy element nadrzędny zawiera inny element z określoną klasą, możesz użyć jednego z poniższych. (przykład)

var parent = document.querySelector('.parent');

if (parent.querySelector('.child') !== null) {
    // .. it exists as a child
}

Alternatywnie możesz użyć .contains()metody na elemencie nadrzędnym. (przykład)

var parent = document.querySelector('.parent'),
    child = document.querySelector('.child');

if (parent.contains(child)) {
    // .. it exists as a child
}

.. i wreszcie, jeśli chcesz sprawdzić, czy dany element zawiera tylko określoną klasę, użyj:

if (el.classList.contains(className)) {
    // .. el contains the class
}

$('div').hasClass('mydivclass')// Returns true if the class exist.

Oto rozwiązanie bez użycia Jquery

var hasClass = element.classList.contains('class name to search');
// hasClass is boolean
if(hasClass === true)
{
     // Class exists
}

link referencyjny

To całkiem proste ...

if ($('.mydivclass').length > 0) {
  //do something
}

Aby divjawnie przetestować elementy:

if( $('div.mydivclass').length ){...}

Prosty kod podano poniżej:

if ($('.mydivclass').length > 0) {
   //Things to do if class exist
}

Aby ukryć div z identyfikatorem szczegółu:

if ($('#'+given_id+'.mydivclass').length > 0) {
   //Things to do if class exist
}

Oto kilka sposobów:

1.  if($("div").hasClass("mydivclass")){
    //Your code

    //It returns true if any div has 'mydivclass' name. It is a based on the class name
    }

2. if($("#myid1").hasClass("mydivclass")){
    //Your code


    //  It returns true if specific div(myid1) has this class "mydivclass" name. 
    //  It is a  based on the specific div id's.
    }           
3. if($("div[class='mydivclass']").length > 0){
    //Your code

   // It returns all the divs whose class name is "mydivclass"
   //  and it's length would be greater than one.
    }

Możemy użyć dowolnego z opisanych powyżej sposobów w zależności od wymagań.

if ($(".mydivclass").size()){
   // code here
}

size()Metoda tylko zwraca liczbę elementów, które wybiera selektora jQuery - w tym przypadku liczbę elementów z klasy mydivclass. Jeśli zwraca 0, wyrażenie jest fałszywe, a zatem nie ma żadnej, a jeśli zwraca jakąkolwiek inną liczbę, div musi istnieć.

sprawdź, czy div istnieje z określoną klasą

if ($(".mydivclass").length > 0) //it exists 
{

}

if($(".myClass")[0] != undefined){
  // it exists
}else{
  // does not exist
}

var x = document.getElementsByClassName("class name");
if (x[0]) {
alert('has');
} else {
alert('no has');
}

W Jquery możesz używać tego w ten sposób.

if ($(".className")[0]){

   // Do something if class exists

} else {

// Do something if class does not exist

}

Z JavaScript

if (document.getElementsByClassName("className").length > 0) {

// Do something if class exists

}else{

    // Do something if class does not exist

}

Oto bardzo przykładowe rozwiązanie dla klasy kontrolnej (hasClass) w JavaScript:

const mydivclass = document.querySelector('.mydivclass');
// if 'hasClass' is exist on 'mydivclass'
if(mydivclass.classList.contains('hasClass')) {
   // do something if 'hasClass' is exist.
}

Najlepszy sposób na Javascript:

if (document.getElementsByClassName("search-box").length > 0) {
// do something
}

if ($ („# myid1”). hasClass („mydivclass”)) {// Zrób coś}

Użyj tego, aby przeszukać całą stronę

if($('*').hasClass('mydivclass')){
// Do Stuff
}