javascript - with - title jquery html




Como encontrar se div com id específico existe em jQuery? (7)

A maneira mais simples é ..

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

Isso também faz parte das especificações do 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.

Eu tenho uma função que acrescenta um <div> a um elemento no clique. A função obtém o texto do elemento clicado e atribui a uma variável chamada name . Essa variável é então usada como o id <div> do elemento anexado.

Eu preciso ver se um id com name já existe antes de adicionar o elemento, mas não sei como encontrar isso.

Aqui está o meu código:

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

Isso parece bastante simples, mas estou recebendo o erro " Fim de arquivo inesperado ao pesquisar por nome de classe" . Eu não tenho ideia do que isso significa.

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

O que é mais é que eu quero ser capaz de excluir este elemento se eu fechar o que deve então remover o div id [name] do documento, mas .remove() não faz isso.

Aqui está o código para isso:

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

Eu adicionei .mini-close à função append como um filho de .labels então havia uma maneira de fechar o <div> acrescentado, se necessário. Depois de clicar em .mini-close e tentar clicar novamente no mesmo nome de li.friends ele ainda encontra o div id [name] e retorna a primeira parte da minha declaração if .


A resposta de Nick as une. Você também pode usar o valor de retorno de getElementById diretamente como sua condição, em vez de compará-lo com null (de qualquer forma funciona, mas eu pessoalmente acho esse estilo um pouco mais legível):

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

Coloque o id que você deseja verificar no jquery é o método.

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
}

Tente verificar o comprimento do seletor, se ele retorna algo, então o elemento deve existir outra coisa.

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
}

Use a primeira condição se para id e a segunda para a classe.


Você pode usar o .length após o seletor para ver se ele corresponde a algum elemento, como este:

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

A versão completa:

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

Ou a versão não-jQuery para esta parte (já que é um ID):

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

Você pode verificar usando jquery simplesmente assim:

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

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

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




jquery