jQuery에서 null 객체를 확인하는 방법


169

jQuery를 사용하고 있으며 페이지에 요소가 있는지 확인하고 싶습니다. 다음 코드를 작성했지만 작동하지 않습니다.

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

요소의 존재를 어떻게 확인합니까?

답변:


251

jQuery FAQ 확인 ...

선택기에서 반환 한 jQuery 컬렉션의 length 속성을 사용할 수 있습니다.

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

var _myDiv = $ ( '# myDiv')에 대해 어떻게 생각하십니까? ... .... if (_myDiv.lenght) {...}에서 예외가 발생합니다.
누리 YILMAZ

1
전자석이 말했듯이; .length를 피하는 것이 좋습니다
numediaweb

5
@AurelianoBuendia, lenght대신에 사용 했습니다 length; 철자 오류입니다.
Sam

4
@numediaweb, eleotlecram은 피하기 위해 말하지 않았습니다 .length.
Sam

1
그러나 .. "null의 'length'속성을 읽을 수 없습니다"오류가 발생하지 않습니까?
Sagive SEO 2014

61

(나는 대답을 투표 할만 큼 평판이 좋지 않은 것 같습니다 ...)

울프 는 다음과 같이 썼다.

undefined 또는 null 객체에서 length 속성을 호출하면 IE 및 웹킷 브라우저가 실패합니다!

대신 이것을 시도하십시오 :

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

또는

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

이 정의되지 않은 또는 null 객체의 길이 속성을 호출하면 실패 브라우저의 원인이됩니다 것은 사실이지만, jQuery의 셀렉터의 결과합니다 ($은 ( '...')) 것입니다 결코 null 또는 정의되지 않은 수 없습니다. 따라서 코드 제안은 의미가 없습니다. 다른 답변 중 하나를 사용하면 더 이해가됩니다.


(2012 업데이트) 사람들이 코드를 보았고이 답변이 목록에서 상당히 높기 때문에 : 지난 몇 년 동안이 작은 플러그인을 사용 해 왔습니다.

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

나는 $ ( 'div'). any ()$ ( 'div'). length 보다 더 잘 읽고 오타로 고통받지 않을 것이라고 생각합니다 : $ ( 'div'). ayn () 은 런타임 오류를 줄 것입니다 , $ ( 'div'). lenght는 조용히 항상 거짓 일 것입니다.

__
2012 년 11 월 수정 :

1) 사람들은 코드를보고 코드 주위에 언급 된 내용을 읽지 않는 경향이 있기 때문에 인용 된 Wolf 코드에 두 가지 큰주의 사항을 추가했습니다.
2)이 상황에 사용하는 작은 플러그인의 코드를 추가했습니다.


2
@VovaPopov : 다음에 답을 읽는 데 약간의 시간이 더 걸릴 것을 제안합니다. 나는 "Wolf에 의한"코드 예제가 틀렸다고 말하고 있었다. 나는 대답을 한 번도 제공하지 않았고 더 이해가되는 다른 대답 중 일부를 언급했습니다.
eleotlecram

좋은 대답입니다. 사람들이 잘못 해석해서 죄송합니다.
Joe Simmons

14

lookup 함수는 일치하는 요소의 배열을 반환합니다. 길이가 0인지 확인할 수 있습니다. 변경 사항을 한 번만 찾아서 필요에 따라 결과를 재사용하십시오.

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

또한 텍스트 함수를 사용해 보았습니다. 요소가 없으면 아무것도하지 않습니다.

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

7
0은 잘못된 값이므로 elem.length 표현식은 false로 평가됩니다. 즉, '! = 0'부분이 필요하지 않습니다
James

2
@ 999, 제로에 대한 검사는 코드를 읽을 수있게하지만 언어를 스크립팅하는 데 익숙한 사람이 두 가지 방법을 모두 읽을 수 있다고 생각합니다.
Sam

12

jquery $ () 함수는 항상 null이 아닌 값을 반환합니다. 즉, 선택기 cretaria와 일치하는 요소를 의미합니다. 요소를 찾지 못하면 빈 배열을 반환합니다. 따라서 코드는 다음과 같습니다.

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

1
$ ()가 배열을 반환하는 것이 사실이라고 생각하지 않습니다. jQuery 객체에는 배열과 비슷한 동작이 있지만 실제로는 배열이라고 생각하지 않으며 모든 동작이 배열과 동일하지는 않습니다. 이 빠른 데모를 참조하십시오 .
Sam

5

jQuery 1.4에는 $ .isEmptyObject 함수가 있지만, Drupal 개발자와 같은 이전 버전의 jQ를 사용해야하는 경우이 코드를 사용하지 마십시오.

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

다음과 같이 사용하십시오.

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

이것은 문제를 다루지 않습니다.
Sam

5

무엇을 선택하든 함수는 $()항상 jQuery 객체를 반환하므로 테스트에 사용할 수 없습니다. 가장 좋은 방법은 아직은 아니지만 size()위에서 설명한대로 함수 또는 기본 길이 속성 을 사용하는 것입니다.

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

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

모든 네이티브 jQuery 메소드에 의해 반환되는 jQuery 객체는 배열이 아니며 많은 속성을 가진 객체입니다. 그들 중 하나는 "길이"속성입니다. 또한 size () 또는 get (0) 또는 get ()을 확인할 수 있습니다. 'get (0)'은 첫 번째 요소에 액세스하는 것과 동일하게 작동합니다. 즉 $ (elem) [0]



1

$("#selector").get(0)그런 null을 확인 하는 데 사용 하십시오. get은 길이 속성을 확인해야하는 배열을 다룰 때까지 dom 요소를 반환합니다. 나는 개인적으로 null 처리에 대한 길이 검사를 좋아하지 않으며 어떤 이유로 든 혼란 스럽습니다. :)


다른 사람들이 다르게 생각하는 방식이 흥미 롭습니다. 첫 번째 요소가 있는지 확인하는 것보다 요소 수가 0인지 확인하는 것이 더 합리적이라고 생각합니다.
Sam

1

길이 속성을 사용하면이 작업을 수행 할 수 있습니다.

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

2
(이) .length> 0을 의미합니까?
sage88

0

객체가 비어 있으면이 오류를 반환합니다.

Uncaught TypeError: Cannot read property '0' of null

나는이 코드를 시도 :

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

undefined 또는 null 객체에서 length 속성을 호출하면 IE 및 웹킷 브라우저가 실패합니다!

대신 이것을 시도하십시오 :

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

또는

if($("#something") === null){
  // don't do something
}
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.