jQuery: controlla se esiste div con un determinato nome di classe

Usando jQuery sto generando a livello di codice un sacco di divcome questo:

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

In qualche altra parte del mio codice devo rilevare se esistono questi DIV. Il nome della classe per i div è lo stesso ma l'ID cambia per ogni div. Qualche idea su come rilevarli usando jQuery?

Puoi semplificarlo controllando il primo oggetto che viene restituito da JQuery in questo modo:

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

In questo caso, se esiste un valore di verità nel primo [0]indice ( ), allora supponiamo che esista la classe.

Modifica 04/10/2013: ho creato un caso di test jsperf qui .

È possibile utilizzare size(), ma jQuery consiglia di utilizzare la lunghezza per evitare il sovraccarico di un'altra chiamata di funzione:

$('div.mydivclass').length

Così:

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

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

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

AGGIORNARE

La risposta selezionata utilizza un test perf, ma è leggermente imperfetta poiché include anche la selezione degli elementi come parte del perf, che non è ciò che viene testato qui. Ecco un perf test aggiornato:

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

La mia prima esecuzione del test mostra che il recupero delle proprietà è più veloce del recupero dell'indice, sebbene l'IMO sia piuttosto trascurabile. Preferisco ancora usare la lunghezza per me, ha più senso per l'intento del codice piuttosto che una condizione più concisa.

Senza jQuery:

JavaScript nativo sarà sempre più veloce. In questo caso: (esempio)

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

Se si desidera verificare se un elemento padre contiene un altro elemento con una classe specifica, è possibile utilizzare uno dei seguenti. (esempio)

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

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

In alternativa, è possibile utilizzare il .contains()metodo sull'elemento padre. (esempio)

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

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

..e infine, per verificare se un determinato elemento contiene semplicemente una determinata classe, utilizzare:

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

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

Ecco una soluzione senza usare Jquery

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

link di riferimento

È abbastanza semplice ...

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

Per verificare divesplicitamente gli elementi:

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

Di seguito è riportato il codice semplice:

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

Per nascondere il div con ID particuler:

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

Ecco alcuni modi:

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.
    }

Possiamo utilizzare uno qualsiasi dei modi definiti in base al requisito.

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

Il size()metodo restituisce semplicemente il numero di elementi che il selettore jQuery seleziona - in questo caso il numero di elementi con la classe mydivclass. Se restituisce 0, l'espressione è falsa e quindi non ce ne sono, e se restituisce qualsiasi altro numero, i div devono esistere.

controlla se il div esiste con una certa classe

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');
}

In Jquery puoi usare così.

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

   // Do something if class exists

} else {

// Do something if class does not exist

}

Con JavaScript

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

// Do something if class exists

}else{

    // Do something if class does not exist

}

Ecco una soluzione di esempio per la classe di controllo (hasClass) in Javascript:

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

Il modo migliore in Javascript:

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

if ($ ("# myid1"). hasClass ("mydivclass")) {// Fai qualsiasi cosa}

Usa questo per cercare l'intera pagina

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