2017-07-01 9 views
0

私はCSS3のJQueryとHTML5を使ってアニメーション検索バーを作成していましたが、この問題を処理するWeb上のコードを見つけました。要素の長さがnullになるはずならば、我々がチェックしているのはなぜこのJQueryステートメントの意味は何ですか?

if ($(selector).closest('.class').length === 0)) { 
    // do something 

} 

:しかし、私はの意味をキャッチしていないコードの行がありますか?

+0

あなたはどちらの部分を理解していませんか? '$(セレクタ)'、 'nearest( '。class')'、 'length'? – JJJ

+1

[documentation](https://api.jquery.com/closest/) –

+0

を確認できます。私は非常に具体的ではなかったと申し訳ありません。 –

答えて

1

使用jQueryのセレクタまたは機能を一致==とは異なり、値が一致しますトラバース(すなわち、 children(),またはfind())は常にjQueryオブジェクトを返しますので、決してnullまたはundefinedにはなりません。
このオブジェクトには、セレクタおよび/またはトラバーサル関数に一致する要素のセットが含まれ、このセットのサイズを示すlengthプロパティもあります。
セレクタが何も一致しなくても、長さが0のjQueryオブジェクトが残っています。そのため、lengthプロパティを使用して結果があるかどうかを判断します。

+0

ありがとうございました –

2

Selector(要素自体を含む)から始まり、DOMツリーを移動し、.classの要素があるかどうかを確認します。 northingが見つかった場合は、コードを実行します。以下は、公式文書のサンプルコードです。私はあなたがこれを試す場合は、DOMツリーを旅しながら、出力として1が、それはul要素を見つけたので、ことがわかります、あなたの質問

<ul id="one" class="level-1"> 
    <li class="item-i">I</li> 
    <li id="ii" class="item-i">II 
    <ul class="level-2"> 
     <li class="item-a">A</li> 
     <li class="item-b">B 
     <ul class="level-3"> 
      <li class="item-1">1</li> 
      <li class="item-2">2</li> 
      <li class="item-3">3</li> 
     </ul> 
     </li> 
     <li class="item-c">C</li> 
    </ul> 
    </li> 
    <li class="item-i">III</li> 
</ul> 

を説明するためにそれを使用します。一度見つけたら、それは止まる。

console.log($("li.item-a").closest("ul").length); 
  1. その要素を含む検索自体

    console.log($("li.item-a").closest("li")); 
    

    ウィル出力

    Object { 0: <li.item-a>, length: 1, prevObject: Object }

  2. は、彼は、すぐに彼は1

    見られるように返すことを証明するためにあることを証明するために、
    console.log($("li.item-a").closest("li.item-i")); 
    

    ウィル出力

    Object { 0: <li#ii.item-i>, length: 1, prevObject: Object } 
    

編集

はnullではありません。

console.log($("li.item-a").closest("li.noClass")); 

簡単な言語で

Object { length: 0, prevObject: Object } 

For More info about .closest()

1

を返します... $(セレクタ)上記の要素

に最も近い要素を見つけ.closest要素 を見つけますたとえば -

$(selector).closest('form').submit();

セレクタ要素

に最も近いフォームを送信し、「===」演算子は、データ型と値だけ

関連する問題