javascript - div要素が空かどうかを確認する方法

Question

重複の可能性：
jQueryでhtml要素が空かどうかを確認する

私はこのような空のdivを持っています：

<div id="cartContent"></div>

空かどうかを確認する必要があります。空の場合はtrueを返す必要があり、次にいくつかを返す必要があります

要素が追加されます。そうでない場合はfalseを返し、他の関数が実行されます。あるかどうかを確認するための最良の方法は何ですか

divの要素？

ありがとう

score 54 · Accepted Answer

プレーンJavaScriptを使用する

 var isEmpty = document.getElementById('cartContent').innerHTML === "";

また、jqueryを使用している場合は、次のように実行できます。

 var isEmpty = $("#cartContent").html() === "";

score 38 · Accepted Answer

ネイティブJavaScriptを使用できます。

if document.getElementById('cartContent').innerHTML === "" {

あなたが使用することができます.is()：

if( $('#leftmenu').is(':empty') ) {

lengthまたは、プロパティをテストして、見つかったかどうかを確認することもできます。

if( $('#leftmenu:empty').length ) {

$.trim()空白を削除し（必要な場合）、コンテンツの長さを確認するために使用できます。

if( !$.trim( $('#leftmenu').html() ).length ) {

score 10 · Accepted Answer

他の人がすでに述べたように、次:emptyのようにjQueryで使用できます。

$('#cartContent:empty').remove();

#cartContent空の場合はdivを削除します。

しかし、人々がここで提案しているこのテクニックや他のテクニックは、空白を含むテキストノードがある場合は空とは見なされないため、あなたが望むことを行わない可能性があります。したがって、これは空ではありません。

<div> </div>

あなたはそれを空と見なしたいかもしれませんが。

私はしばらく前にこの問題を抱えていて、この小さなjQueryプラグインを作成しました-コードに追加するだけです：

jQuery.expr[':'].space = function(elem) {
  var $elem = jQuery(elem);
  return !$elem.children().length && !$elem.text().match(/\S/);
}

そして今、あなたは使用することができます

$('#cartContent:space').remove();

空または空白のみが含まれている場合、divは削除されます。もちろん、それを削除するだけでなく、好きなことをすることもできます。

$('#cartContent:space').append('<p>It is empty</p>');

そして、あなたはこのように使うことができます:not：

$('#cartContent:not(:space)').append('<p>It is not empty</p>');

私はこのテストを思いついたので、私が望んでいたことを確実に実行しました。プラグインから取り出して、スタンドアロンテストとして使用できます。

これはjQueryオブジェクトで機能します：

function testEmpty($elem) {
  return !$elem.children().length && !$elem.text().match(/\S/);
}

これはDOMノードで機能します。

function testEmpty(elem) {
  var $elem = jQuery(elem);
  return !$elem.children().length && !$elem.text().match(/\S/);
}

上記.trimのコードは、テストされた要素に子要素があるかどうかを最初にテストし、含まれている場合は最初の非空白文字を見つけようとして停止します。文字列が含まれている場合は、文字列を読み取ったり変更したりする必要はありません。空白ではない1文字。

それが役に立てば幸い。

score 6 · Accepted Answer

is関数を使用できます

if( $('#cartContent').is(':empty') ) { }

または長さを使用します

if( $('#cartContent:empty').length ) { }

score 3 · Accepted Answer

3

var empty = $("#cartContent").html().trim().length == 0;

于 2013-01-26T09:50:17.030 に答える

score 1 · Accepted Answer

1

if ($("#cartContent").children().length == 0) 
{
     // no child
}

于 2013-01-26T09:52:13.020 に答える

6 に答える 6