Як дізнатися, чи існує div з конкретним ідентифікатором у jQuery?

У мене є функція, яка додає <div>елемент до клацання. Функція отримує текст натиснутого елемента і присвоює йому змінну, що називається name. Потім ця змінна використовується як <div> idдоданий елемент.

Мені потрібно перевірити, чи існує a <div> idз name, перш ніж додати елемент, але я не знаю, як це знайти.

Ось мій код:

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

Це здається досить простим, але я отримую помилку " Несподіваний кінець файлу під час пошуку назви класу" . У мене немає поняття, що це означає.

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

Більше того, що я хочу мати змогу видалити цей елемент, якщо закрити його, який слід видалити div id [name]з документа, але .remove()цього не зробити.

Ось код для цього:

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

Я додав .mini-closeдо функції додавання в якості дитини, .labelsтому з'явився спосіб закрити додане, <div>якщо потрібно. Після натискання .mini-closeта спроби знову натиснути на те саме ім’я li.friendsвсе одно знаходить div id [name]та повертає першу частину мого ifтвердження.

Ви можете використовувати .lengthпісля селектора, щоб побачити, чи відповідає він будь-яким елементам, наприклад, таким:

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

Повна версія:

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

Або версія не для jQuery для цієї частини (оскільки це ідентифікатор):

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

Відповідь Ніка нігтя це. Ви також можете використовувати зворотне значення getElementById безпосередньо як свою умову, а не порівнювати його з нульовим (у будь-якому випадку працює, але я особисто вважаю цей стиль трохи читабельнішим):

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

Спробуйте перевірити довжину селектора, якщо він щось вам повертає, то елемент повинен існувати інакше.

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
}

Використовуйте перший, якщо умова для id, і другий для класу.

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

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

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

}

Інший спосіб скорочення:

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

Ви можете перевірити, використовуючи jquery просто так:

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

Найпростіший спосіб ..

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

Це також частина специфікацій 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.

Ось функція jQuery, яку я використовую:

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

Це поверне булеве значення. Якщо елемент існує, він повертає true. Якщо ви хочете вибрати елемент за назвою класу, просто замініть #на.

Ви можете впоратися з цим різними способами,

Мета - перевірити, чи існує div, тоді виконати код. Простий.

Хвороба:

$('#myDiv').length

Примітка:

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

Це повертає число кожного разу, коли воно буде виконане, тому якщо немає div, воно дасть нуль [0], а як у нас немає 0, може бути представлено як помилкове у двійковій формі, тому ви можете використовувати його в операторі if. І ви можете використовувати його як порівняння з жодним числом. хоча будь-яке є три твердження, наведені нижче

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

введіть ідентифікатор, який ви хочете перевірити, у jquery - це метод.

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
}