So überprüfen Sie Nullobjekte in jQuery


169

Ich verwende jQuery und möchte die Existenz eines Elements auf meiner Seite überprüfen. Ich habe folgenden Code geschrieben, aber er funktioniert nicht:

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

Wie überprüfe ich die Existenz des Elements?

Antworten:


251

Überprüfen Sie die jQuery FAQ ...

Sie können die Länge-Eigenschaft der von Ihrem Selektor zurückgegebenen jQuery-Auflistung verwenden:

if ( $('#myDiv').length ){}

Was denkst du über var _myDiv = $ ('# myDiv'); ... .... if (_myDiv.lenght) {...} Ausnahme erzeugen.
Nuri YILMAZ

1
wie eleotlecram sagte; Vermeiden Sie besser .length
numediaweb

5
@ AurelianoBuendia, die Sie lenghtanstelle von verwendet haben length; Es ist ein Rechtschreibfehler.
Sam

4
@numediaweb, eleotlecram sagte nicht zu vermeiden .length.
Sam

1
aber ... würden Sie nicht den Fehler "Eigenschaft 'Länge' von Null kann nicht gelesen werden" erhalten?
Sagive SEO

61

(Da ich nicht genug Ruf zu haben scheine, um die Antwort abzustimmen ...)

Wolf schrieb:

Das Aufrufen der Eigenschaft length für ein undefiniertes oder ein Null-Objekt führt dazu, dass IE- und Webkit-Browser fehlschlagen!

Versuchen Sie stattdessen Folgendes:

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

oder

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

Zwar führt das Aufrufen der Eigenschaft length für ein undefiniertes oder null-Objekt zum Ausfall von Browsern, doch das Ergebnis der Selektoren von jQuery ($ ('...')) ist niemals null oder undefiniert. Daher machen die Codevorschläge keinen Sinn. Verwenden Sie eine der anderen Antworten, sie sind sinnvoller.


(Update 2012) Weil die Leute sich Code ansehen und diese Antwort ganz oben auf der Liste steht: In den letzten Jahren habe ich dieses kleine Plugin verwendet:

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

Ich denke, $ ('div'). Any () liest sich besser als $ ('div'). Length , außerdem leiden Sie nicht so sehr unter Tippfehlern: $ ('div'). Ayn () gibt einen Laufzeitfehler aus , $ ('div'). Länge wird lautlos höchstwahrscheinlich immer falsch sein.

__
Änderungen November 2012:

1) Da die Leute dazu neigen, Code zu betrachten und nicht zu lesen, was um den Code herum gesagt wird, habe ich dem zitierten Code von Wolf zwei große Vorbehaltsnotizen hinzugefügt.
2) Ich habe den Code des kleinen Plugins hinzugefügt, das ich für diese Situation verwende.


2
@VovaPopov: Ich schlage vor, dass Sie sich das nächste Mal etwas mehr Zeit nehmen, um die Antwort zu lesen. Ich habe lediglich festgestellt, dass das Codebeispiel "von Wolf" falsch war. Ich habe nie eine Antwort gegeben, sondern nur auf einige der anderen Antworten verwiesen, die sinnvoller sind.
Eleotlecram

Gute Antwort. Es tut mir leid, dass die Leute es falsch interpretieren.
Joe Simmons

14

Die Suchfunktion gibt ein Array übereinstimmender Elemente zurück. Sie können überprüfen, ob die Länge Null ist. Beachten Sie die Änderung, dass die Elemente nur einmal nachgeschlagen und die Ergebnisse nach Bedarf wiederverwendet werden.

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

Haben Sie auch versucht, nur die Textfunktion zu verwenden? Wenn kein Element vorhanden ist, führt dies zu nichts.

$("#btext" + i).text("Branch " + i);

7
0 ist ein falscher Wert, daher wird der Ausdruck elem.length als falsch ausgewertet - mit anderen Worten, der Teil '! = 0' ist nicht erforderlich
James

2
@ 999, ich denke, die Prüfung gegen Null macht den Code besser lesbar, obwohl beide Möglichkeiten wahrscheinlich für jemanden lesbar sind, der an Skriptsprachen gewöhnt ist.
Sam

12

Die Funktion jquery $ () gibt immer einen Wert ungleich Null zurück - mittlere Elemente, die mit Ihrer Selektor-Kretaria übereinstimmen. Wenn das Element nicht gefunden wurde, wird ein leeres Array zurückgegeben. Ihr Code sieht also ungefähr so ​​aus -

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

1
Ich denke nicht, dass es stimmt, dass $ () ein Array zurückgibt. jQuery-Objekte weisen ein Verhalten auf, das Arrays ähnelt, aber ich glaube nicht, dass es sich tatsächlich um Arrays handelt, und ich denke, Sie werden feststellen, dass nicht alle Verhaltensweisen mit denen von Arrays identisch sind. Sehen Sie sich diese kurze Demonstration an .
Sam

5

In jQuery 1.4 erhalten Sie die Funktion $ .isEmptyObject. Wenn Sie jedoch gezwungen sind, eine ältere Version von jQ wie uns armen Drupal-Entwicklern zu verwenden, stehlen Sie einfach diesen Code:

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

Verwenden Sie es wie:

console.log(isObjectEmpty(the_object)); // Returns true or false.

Dies geht nicht auf die Frage ein.
Sam

5

Unabhängig von Ihrer Auswahl gibt die Funktion $()immer ein jQuery-Objekt zurück, sodass es nicht zum Testen verwendet werden kann. Der bisher beste Weg (wenn nicht der einzige) besteht darin, die size()Funktion oder die native Längeneigenschaft wie oben erläutert zu verwenden.

if ( $('selector').size() ) {...}                   

3
if ( $('#whatever')[0] ) {...}

Das jQuery-Objekt, das von allen nativen jQuery-Methoden zurückgegeben wird, ist KEIN Array, sondern ein Objekt mit vielen Eigenschaften. Eine davon ist eine "Längen" -Eigenschaft. Sie können auch nach Größe () oder get (0) oder get () suchen - 'get (0)' funktioniert genauso wie der Zugriff auf das erste Element, dh $ (elem) [0]



1

Verwenden Sie $("#selector").get(0)diese Option, um mit null zu prüfen. get gibt das dom-Element zurück. Bis dahin handelt es sich um ein Array, in dem Sie die Eigenschaft length überprüfen müssen. Ich persönlich mag keine Längenprüfung für die Nullbehandlung, das verwirrt mich aus irgendeinem Grund :)


Es ist interessant, wie verschiedene Menschen unterschiedlich denken. Ich denke, es ist sinnvoller zu prüfen, ob die Anzahl der Elemente Null ist, als zu prüfen, ob das erste Element vorhanden ist.
Sam

1

Mit der Eigenschaft length können Sie dies tun.

jQuery.fn.exists = function(){return ($(this).length < 0);}
if ($(selector).exists()) { 
   //do somthing
}

2
Meinst du (diese) Länge> 0?
sage88

0

Wenn das Objekt leer ist, geben Sie diesen Fehler zurück:

Uncaught TypeError: Cannot read property '0' of null

Ich versuche diesen Code:

try{
  if ($("#btext" + i).length) {};               
}catch(err){
  if ($("#btext" + i).length) {
     //working this code if the item, not NULL 
   }
}

-4
if (typeof($("#btext" + i)) == 'object'){
    $("#btext" + i).text("Branch " + i);
}

-7

Das Aufrufen der Eigenschaft length für ein undefiniertes oder ein Null-Objekt führt dazu, dass IE- und Webkit-Browser fehlschlagen!

Versuchen Sie stattdessen Folgendes:

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

oder

if($("#something") === null){
  // don't do something
}
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.