Jak sprawdzić, czy div o określonym identyfikatorze istnieje w jQuery?

Mam funkcję, która dodaje <div>element do kliknięcia. Funkcja pobiera tekst klikniętego elementu i przypisuje go do zmiennej o nazwie name. Ta zmienna jest następnie używana jako<div> id dołączony element.

Muszę zobaczyć, czy <div> idzname już istnieje, zanim dołączy element, ale nie wiem jak znaleźć tego.

Oto mój kod:

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

Wydaje się to dość proste, ale pojawia się błąd „ Nieoczekiwany koniec pliku podczas wyszukiwania nazwy klasy” . Nie mam pojęcia, co to znaczy.

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

Co więcej, chcę, aby móc usunąć ten element, jeśli go zamknę, co powinno następnie usunąć div id [name]dokument, ale.remove() tego nie robi.

Oto kod do tego:

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

Dodałem .mini-closedo funkcji append jako dziecko, .labelswięc był sposób na zamknięcie dołączonej w <div>razie potrzeby. Po kliknięciu .mini-closei ponownym kliknięciu tej samej nazwy li.friendsnadal znajduje się div id [name]i zwraca pierwszą część mojego ifwyciągu.

Możesz użyć .lengthpo selektorze, aby sprawdzić, czy pasuje on do jakichkolwiek elementów, takich jak to:

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

Pełna wersja:

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

Lub wersja nie-jQuery dla tej części (ponieważ jest to identyfikator):

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

Odpowiedź Nicka to wbija. Możesz również użyć wartości zwracanej getElementById bezpośrednio jako warunku, zamiast porównywać ją z wartością null (tak czy inaczej działa, ale osobiście uważam ten styl za bardziej czytelny):

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

Spróbuj sprawdzić długość selektora, jeśli coś ci zwróci, element musi istnieć, inaczej nie.

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
}

Użyj pierwszego warunku if dla id, a drugiego dla klasy.

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

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

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

}

Innym skrótowym sposobem:

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

Możesz to sprawdzić za pomocą jquery:

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

Najprostszym sposobem jest ..

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

Jest to również część specyfikacji HTML5: 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.

Oto funkcja jQuery, której używam:

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

Zwróci to wartość logiczną. Jeśli element istnieje, zwraca wartość true. Jeśli chcesz, aby wybrać element, przez nazwę klasy, po prostu zastąpić #z.

Możesz sobie z tym poradzić na różne sposoby,

Celem jest sprawdzenie, czy div istnieje, a następnie wykonanie kodu. Prosty.

Stan: schorzenie:

$('#myDiv').length

Uwaga:

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

Zwróci liczbę za każdym razem, gdy jest wykonywana, więc jeśli nie ma div, da Zero [0], a ponieważ nie mamy 0 może być reprezentowane jako fałsz w pliku binarnym, więc możesz użyć go w instrukcji if. I możesz użyć go jako porównania z liczbą zerową. podczas gdy istnieją trzy podane poniżej oświadczenia

// 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>");
    }

wstaw identyfikator, który chcesz sprawdzić w jquery is method.

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
}