[JQUERY] HTML 요소는 jQuery를 사용하여 비어있는 경우 어떻게 확인합니까?

HTML 요소는 jQuery를 사용하여 비어있는 경우 어떻게 확인합니까?

해결법

1. ---

   1.

   if ($('#element').is(':empty')){
     //do something
   }
   

   추가 정보를 원하시면 볼 http://api.jquery.com/is/ 및 http://api.jquery.com/empty-selector/

   편집하다:

   일부는 지적했듯이, 빈 요소의 브라우저 해석은 다를 수 있습니다. 당신은 공백 문자 나 줄 바꿈 등의 보이지 않는 요소를 무시하고 함수를 만들 수 있습니다 구현이 일관성을 좋아 (또는 그것의 코드 내부를 사용) 할 경우.

     function isEmpty( el ){
         return !$.trim(el.html())
     }
     if (isEmpty($('#element'))) {
         // do something
     }
   

   또한 jQuery 플러그인으로 그것을 만들 수 있습니다,하지만 당신은 아이디어를 얻을.

2. ---

   2.나는이 (크롬 및 FF 요소로 공백과 줄 바꿈을 고려하기 때문에) 신뢰할 수있는 유일한 방법이 발견 :

   나는이 (크롬 및 FF 요소로 공백과 줄 바꿈을 고려하기 때문에) 신뢰할 수있는 유일한 방법이 발견 :

   if($.trim($("selector").html())=='')
   

3. ---

   3.빈 선택기를 : 공백과 줄 바꿈 사용과 함께 주요 문제입니다. 주의는 CSS에서 : 빈 의사 클래스는 같은 방식으로 동작합니다. 나는이 방법을 좋아한다 :

   빈 선택기를 : 공백과 줄 바꿈 사용과 함께 주요 문제입니다. 주의는 CSS에서 : 빈 의사 클래스는 같은 방식으로 동작합니다. 나는이 방법을 좋아한다 :

   if ($someElement.children().length == 0){
        someAction();
   }
   

4. ---

   4.

   !elt.hasChildNodes()
   

   그래, 나도 알아,이 jQuery를하지, 당신이 사용할 수 있도록 :

   !$(elt)[0].hasChildNodes()
   

   이제 행복해?

5. ---

   5.

   jQuery.fn.doSomething = function() {
      //return something with 'this'
   };
   
   $('selector:empty').doSomething();
   

6. ---

   6."비어"에 의한 경우는 더 HTML의 내용과 의미,

   "비어"에 의한 경우는 더 HTML의 내용과 의미,

   if($('#element').html() == "") {
     //call function
   }
   

7. ---

   7.어떤 텍스트가 포함되지에서 비어?

   어떤 텍스트가 포함되지에서 비어?

   if (!$('#element').text().length) {
       ...
   }
   

8. ---

   8.이력서에서 요소가 비어 있는지 확인하는 많은 옵션이 있습니다 :

   이력서에서 요소가 비어 있는지 확인하는 많은 옵션이 있습니다 :

   1 사용하여 HTML :

   if (!$.trim($('p#element').html())) {
       // paragraph with id="element" is empty, your code goes here
   }
   

   2 텍스트를 사용 :

   if (!$.trim($('p#element').text())) {
       // paragraph with id="element" is empty, your code goes here
   }
   

   3 사용 ( '빈')이다 :

   if ($('p#element').is(':empty')) {
       // paragraph with id="element" is empty, your code goes here
   }
   

   4- 길이 사용

   if (!$('p#element').length){
       // paragraph with id="element" is empty, your code goes here
   }
   

   당신이 입력 요소는 발 사용할 수있는 비어 있는지 확인하려는 경우 중독에서 :

   if (!$.trim($('input#element').val())) {
       // input with id="element" is empty, your code goes here
   }
   

9. ---

   9.HTML () 또는 어린이 ()보다 브라우저 이하 "작업"을 요구해야 또 다른 옵션 :

   HTML () 또는 어린이 ()보다 브라우저 이하 "작업"을 요구해야 또 다른 옵션 :

   function isEmpty( el ){
     return !el.has('*').length;
   }
   

10. ---

    10.

    document.getElementById("id").innerHTML == "" || null
    

    또는

    $("element").html() == "" || null
    

11. ---

    11.당신은 시도 할 수 있습니다:

    당신은 시도 할 수 있습니다:

    if($('selector').html().toString().replace(/ /g,'') == "") {
    //code here
    }
    

    * 단지 넣다 공백을 대체)

12. ---

    12.

    if($("#element").html() === "")
    {
    
    }
    

13. ---

    13.당신은) (jQuery.isEmptyObject을 찾고 계십니까?

    당신은) (jQuery.isEmptyObject을 찾고 계십니까?

    http://api.jquery.com/jquery.isemptyobject/

14. ---

    14.여기 https://stackoverflow.com/a/6813294/698289을 기반으로 jQuery를 필터입니다

    여기 https://stackoverflow.com/a/6813294/698289을 기반으로 jQuery를 필터입니다

    $.extend($.expr[':'], {
      trimmedEmpty: function(el) {
        return !$.trim($(el).html());
      }
    });
    

15. ---

    15.자바 스크립트

    자바 스크립트

    var el= document.querySelector('body'); 
    console.log(el);
    console.log('Empty : '+ isEmptyTag(el));
    console.log('Having Children : '+ hasChildren(el));
    
    
    function isEmptyTag(tag) { 
        return (tag.innerHTML.trim() === '') ? true : false ;
    }
    function hasChildren(tag) {
        //return (tag.childElementCount !== 0) ? true : false ; // Not For IE
        //return (tag.childNodes.length !== 0) ? true : false ; // Including Comments
        return (tag.children.length !== 0) ? true : false ; // Only Elements
    }
    

    이 중 하나를 사용하십시오!

    document.getElementsByTagName('div')[0];
    document.getElementsByClassName('topbar')[0];
    
    document.querySelectorAll('div')[0];
    document.querySelector('div'); // gets the first element.
    ​
    

16. ---

    16.이 시도:

    이 시도:

    if (!$('#el').html()) {
        ...
    }
    

17. ---

    17.줄 바꿈은 FF의 요소에 대한 내용으로 간주됩니다.

    줄 바꿈은 FF의 요소에 대한 내용으로 간주됩니다.

    <div>
    </div>
    <div></div>
    

    전의:

    $("div:empty").text("Empty").css('background', '#ff0000');
    

    IE에서 모두 div의는 FF 크롬에서 마지막 하나는 비어있는, 빈 간주됩니다.

    당신은 @qwertymk가 제공하는 솔루션을 사용할 수 있습니다

    if(!/[\S]/.test($('#element').html())) { // for one element
        alert('empty');
    }
    

    또는

    $('.elements').each(function(){  // for many elements
        if(!/[\S]/.test($(this).html())) { 
            // is empty
        }
    })
    

from https://stackoverflow.com/questions/6813227/how-do-i-check-if-an-html-element-is-empty-using-jquery by cc-by-sa and MIT license