Como verificar objetos nulos no jQuery

169

Estou usando o jQuery e quero verificar a existência de um elemento na minha página. Eu escrevi o seguinte código, mas não está funcionando:

if($("#btext" + i) != null) {
    //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}

Como verifico a existência do elemento?

Prashant
fonte

Respostas:

251

Verifique as Perguntas frequentes sobre o jQuery ...

Você pode usar a propriedade length da coleção jQuery retornada pelo seu seletor:

if ( $('#myDiv').length ){}
Christoph
fonte
o que você acha sobre var _myDiv = $ ('# myDiv'); ... .... if (_myDiv.lenght) {...} produz exceção.
Nuri YILMAZ
1
como eleotlecram disse; Melhor evitar .length
numediaweb
5
@AurelianoBuendia, você usou em lenghtvez de length; é um erro de ortografia.
Sam
4
@numediaweb, eleotlecram não disse para evitar .length.
Sam
1
mas .. você não obteria um erro "Não é possível ler a propriedade 'comprimento' de nulo"?
Sagive SEO 25/03
61

(Como não tenho reputação suficiente para votar na resposta ...)

Wolf escreveu:

A propriedade length da chamada em um objeto indefinido ou nulo fará com que os navegadores IE e webkit falhem!

Em vez disso, tente o seguinte:

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") !== null){
  // do something
}

ou

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") === null){
  // don't do something
}

Embora seja verdade que chamar a propriedade length em um objeto indefinido ou nulo cause falhas nos navegadores, o resultado dos seletores do jQuery (o $ ('...')) nunca será nulo ou indefinido. Portanto, as sugestões de código não fazem sentido. Use uma das outras respostas, elas fazem mais sentido.


(Atualização 2012) Como as pessoas veem o código e esta resposta está no topo da lista: Nos últimos dois anos, eu tenho usado este pequeno plugin:

  jQuery.fn['any'] = function() {
     return (this.length > 0);
  };

Eu acho que $ ('div'). Any () lê melhor que $ ('div'). Length , mais você não sofrerá tanto com erros de digitação: $ ('div'). Ayn () dará um erro de tempo de execução , $ ('div'). o comprimento silenciosamente provavelmente sempre será falso.

__
Edições novembro 2012:

1) Como as pessoas tendem a olhar para o código e não ler o que é dito ao redor do código, adicionei duas grandes notas de advertência ao código citado de Wolf.
2) Adicionei o código do pequeno plug-in que uso para esta situação.

eleotlecram
fonte
2
@VovaPopov: Sugiro na próxima vez que você demorar um pouco mais para ler a resposta. Eu estava apenas afirmando que o exemplo de código "de Wolf" estava incorreto. Eu nunca forneci uma resposta, apenas me referi a algumas das outras respostas que fazem mais sentido.
eleotlecram
Boa resposta. Me desculpe, as pessoas interpretam mal.
21713 Joe Simmons
14

A função de pesquisa retorna uma matriz de elementos correspondentes. Você pode verificar se o comprimento é zero. Observe a alteração para procurar apenas os elementos uma vez e reutilizar os resultados conforme necessário.

var elem = $("#btext" + i);
if (elem.length != 0) {
   elem.text("Branch " + i);
}

Além disso, você já tentou usar a função de texto - se nenhum elemento existir, ele não fará nada.

$("#btext" + i).text("Branch " + i);
tvanfosson
fonte
7
0 é um valor falso, de modo que os avalia expressão elem.length false - em outras palavras, não há nenhuma necessidade para a parte '= 0!'
James
2
@ 999, acho que a verificação contra zero torna o código mais legível, embora as duas maneiras provavelmente sejam legíveis para alguém que está acostumado a linguagens de script.
21412 Sam
12

A função jquery $ () sempre retorna um valor não nulo - os elementos médios correspondem à sua cretária do seletor. Se o elemento não foi encontrado, ele retornará uma matriz vazia. Portanto, seu código será mais ou menos assim -

if ($("#btext" + i).length){
        //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}
waney
fonte
1
Não acho que o $ () retorne uma matriz. Os objetos jQuery têm comportamentos semelhantes às matrizes, mas não acho que sejam matrizes, e acho que você descobrirá que nem todo o comportamento deles é igual ao das matrizes. Veja esta demonstração rápida .
10333 Sam
5

No jQuery 1.4, você obtém a função $ .isEmptyObject, mas se for forçado a usar uma versão mais antiga do jQ, como nós, os pobres desenvolvedores do Drupal apenas roubam, use este código:

// This is a function similar to the jQuery 1.4 $.isEmptyObject.
function isObjectEmpty(obj) {
  for ( var name in obj ) {
    return false;
  }
  return true;
}

Use-o como:

console.log(isObjectEmpty(the_object)); // Returns true or false.
theamoeba
fonte
Isso não aborda a questão.
Sam
5

não importa qual seja a sua seleção, a função $()sempre retorna um objeto jQuery para que não possa ser usado para testar. A melhor maneira ainda (se não a única) é usar a size()função ou a propriedade nativa de comprimento, conforme explicado acima.

if ( $('selector').size() ) {...}                   
queimado
fonte
3
if ( $('#whatever')[0] ) {...}

O objeto jQuery retornado por todos os métodos nativos do jQuery NÃO é uma matriz, é um objeto com muitas propriedades; um deles sendo uma propriedade "length". Você também pode verificar o tamanho () ou get (0) ou get () - 'get (0)' funciona da mesma maneira que acessa o primeiro elemento, ou seja, $ (elem) [0]

James
fonte
3

Que tal usar "indefinido"?

if (value != undefined){ // do stuff } 
Hugh Seagraves
fonte
1

use $("#selector").get(0)para verificar com nulo assim. get retorna o elemento dom, até então você está lidando com uma matriz, na qual precisa verificar a propriedade length. Pessoalmente, eu não gosto de verificação de comprimento para manipulação nula, isso me confunde por algum motivo :)

Emre
fonte
É interessante a maneira como as pessoas pensam de maneira diferente; Eu acho que faz mais sentido verificar se o número de elementos é zero, em vez de verificar se o primeiro elemento está presente.
Sam
1

Usando a propriedade length, você pode fazer isso.

jQuery.fn.exists = function(){return ($(this).length < 0);}
if ($(selector).exists()) { 
   //do somthing
}
Suresh Pattu
fonte
2
Você quer dizer (this) .length> 0?
sage88
0

quando o objeto estiver vazio, retorne este erro:

Uncaught TypeError: Cannot read property '0' of null

Eu tento este código:

try{
  if ($("#btext" + i).length) {};               
}catch(err){
  if ($("#btext" + i).length) {
     //working this code if the item, not NULL 
   }
}
ahmadjn
fonte
-4
if (typeof($("#btext" + i)) == 'object'){
    $("#btext" + i).text("Branch " + i);
}
한지 만
fonte
-7

A propriedade length da chamada em um objeto indefinido ou nulo fará com que os navegadores IE e webkit falhem!

Em vez disso, tente o seguinte:

if($("#something") !== null){
  // do something
}

ou

if($("#something") === null){
  // don't do something
}
Lobo
fonte