Wie finde ich heraus, ob div mit einer bestimmten ID in jQuery vorhanden ist?

Ich habe eine Funktion, die beim Klicken ein <div>an ein Element anfügt . Die Funktion ruft den Text des angeklickten Elements ab und weist ihn einer Variablen mit dem Namen zu name. Diese Variable wird dann als <div> iddas angehängte Element verwendet.

Ich muss sehen, ob bereits ein <div> idwith namevorhanden ist, bevor ich das Element anhänge, aber ich weiß nicht, wie ich das finden soll.

Hier ist mein Code:

$("li.friend").live('click', function() {
  name = $(this).text();

  // if-statement checking for existence of <div> should go here
  // If <div> does not exist, then append element
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");

  // Else
    alert('this record already exists');
});

Dies scheint ziemlich einfach zu sein, aber ich erhalte die Fehlermeldung " Unerwartetes Dateiende bei der Suche nach dem Klassennamen" . Ich habe keine Ahnung, was das bedeutet.

if (document.getElementById(name)) {
  $("div#" + name).css({bottom: '30px'});
} else {
  $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
}

Außerdem möchte ich dieses Element löschen können, wenn ich es schließe, wodurch das Element div id [name]aus dem Dokument entfernt werden soll, dies .remove()jedoch nicht.

Hier ist der Code dafür:

$(".mini-close").live('click', function(){
  $(this).parent().remove();
});

Ich .mini-closehabe die Append-Funktion als Kind von hinzugefügt , .labelssodass es eine Möglichkeit gab, die angehängte Funktion <div>bei Bedarf zu schließen. Nach dem Klicken .mini-closeund dem erneuten Klicken auf denselben Namen wird immer li.friendsnoch der gefunden div id [name]und der erste Teil meiner ifAnweisung zurückgegeben.

Sie können .lengthnach der Auswahl verwenden, um festzustellen, ob sie mit Elementen wie den folgenden übereinstimmt:

if($("#" + name).length == 0) {
  //it doesn't exist
}

Die Vollversion:

$("li.friend").live('click', function(){
  name = $(this).text();
  if($("#" + name).length == 0) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});

Oder die Nicht-jQuery-Version für diesen Teil (da es sich um eine ID handelt):

$("li.friend").live('click', function(){
  name = $(this).text();
  if(document.getElementById(name) == null) {
    $("div#chatbar").append("<div class='labels'><div id='" + name + "' style='display:none;'></div>" + name + "</div>");
  } else {
    alert('this record already exists');
  }
});

Nicks Antwort trifft es. Sie können den Rückgabewert von getElementById auch direkt als Bedingung verwenden, anstatt ihn mit null zu vergleichen (so oder so funktioniert es, aber ich persönlich finde diesen Stil etwas lesbarer):

if (document.getElementById(name)) {
  alert('this record already exists');
} else {
  // do stuff
}

Versuchen Sie, die Länge des Selektors zu überprüfen. Wenn er Ihnen etwas zurückgibt, muss das Element vorhanden sein, sonst nicht.

if( $('#selector').length )         // use this if you are using id to check
{
     // it exists
}


if( $('.selector').length )         // use this if you are using class to check
{
     // it exists
}

Verwenden Sie die erste if-Bedingung für id und die zweite für class.

if($("#id").length) /*exists*/

if(!$("#id").length) /*doesn't exist*/

if ( $( "#myDiv" ).length ) {
    //id id ( "#myDiv" ) is exist this will perform
    $( "#myDiv" ).show();

}

Eine andere Abkürzung:

    $( "#myDiv" ).length && $( "#myDiv" ).show();

Sie können dies mit jquery einfach folgendermaßen überprüfen:

if($('#divId').length!==0){
      Your Code Here
}

Der einfachste Weg ist ..

if(window["myId"]){
    // ..
}

Dies ist auch Teil der HTML5-Spezifikationen: https://www.w3.org/TR/html5/single-page.html#accessing-other-browsing-contexts#named-access-on-the-window-object

window[name]
    Returns the indicated element or collection of elements.

Hier ist die von mir verwendete jQuery-Funktion:

function isExists(var elemId){
    return jQuery('#'+elemId).length > 0;
}

Dies gibt einen booleschen Wert zurück. Wenn ein Element vorhanden ist, wird true zurückgegeben. Wenn Sie mit dem Klassennamen auswählen Element möchten, ersetzen Sie einfach #mit.

Sie können auf verschiedene Arten damit umgehen,

Ziel ist es zu überprüfen, ob das div existiert, und dann den Code auszuführen. Einfach.

Bedingung:

$('#myDiv').length

Hinweis:

#myDiv -> < div id='myDiv' > <br>
.myDiv -> < div class='myDiv' > 

Dies gibt jedes Mal eine Zahl zurück, wenn es ausgeführt wird. Wenn es kein div gibt, gibt es eine Null [0], und da keine 0 in binär als falsch dargestellt werden kann, können Sie sie in der if-Anweisung verwenden. Und Sie können es als Vergleich mit einer Zahl ohne Zahl verwenden. während jeder gibt es drei Aussagen unten gegeben

// Statement 0
// jQuery/Ajax has replace [ document.getElementById with $ sign ] and etc
// if you don't want to use jQuery/ajax 

   if (document.getElementById(name)) { 
      $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 1
   if ($('#'+ name).length){ // if 0 then false ; if not 0 then true
       $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 2
    if(!$('#'+ name).length){ // ! Means Not. So if it 0 not then [0 not is 1]
           $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>"); 
    }
// Statement 3
    if ($('#'+ name).length > 0 ) {
      $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

// Statement 4
    if ($('#'+ name).length !== 0 ) { // length not equal to 0 which mean exist.
       $("div#page-content div#chatbar").append("<div class='labels'>" + name + "</div><div id='" + name + "'></div>");
    }

Geben Sie die ID, die Sie einchecken möchten, in die Methode jquery is ein.

var idcheck = $("selector").is("#id"); 

if(idcheck){ // if the selector contains particular id

// your code if particular Id is there

}
else{
// your code if particular Id is NOT there
}