Как узнать, существует ли div с определенным идентификатором в jQuery?

У меня есть функция, которая добавляет <div>элемент к щелчку. Функция получает текст выбранного элемента и присваивает его переменной с именем name. Эта переменная затем используется в <div> idкачестве добавленного элемента.

Мне нужно посмотреть, существует ли уже <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 непосредственно в качестве условия, а не сравнивать его со значением null (в любом случае это работает, но лично я нахожу этот стиль немного более читабельным):

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
}

Используйте первое условие if для 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 не существует, он выдаст Zero [0], и, поскольку мы no 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
}