javascript - 2 つのセレクター要素が存在し、jQuery で同じ値を持っているかどうかを確認します

Question

次のコードを検討してください。

if ( $('.sidebar-primary, .sidebar-secondary').css('float') === 'left' ) {

.sidebar-secondaryHTML に存在しなくてもtrueになります。.sidebar-secondary が存在しない場合があるのはなぜですか?

Answer 1

「一致した要素のセットの最初の要素のスタイル プロパティの値を取得するか、一致した要素ごとに 1 つ以上の CSS プロパティを設定します。」( http://api.jquery.com/css/ )..

試してみてください：

if (
   $('.sidebar-primary').css('float') === 'left' && 
   $('.sidebar-secondary').css('float') === 'left' ){
   // Your code here...
}

Answer 2

最初のセレクターに一致するため、これ.sidebar-primaryしかない場合は評価されます。
これを解決するには、1 つずつ比較する必要があります。

次のデモを見て、何が起こるかを確認してください。

Answer 3

条件ステートメントを部分に分割します。

if ($('.sidebar-primary').css('float') === 'left' && $('.sidebar-secondary').css('float') === 'left')) {
   //Do your stuff!
}

または、チェックしたい要素のリストが大きい場合は、次のようにします。

function CheckFloat() {
    $('.sidebar-primary, .sidebar-secondary').each(function(i, e) {
      if (e.css('float') != 'left') {
          return false;
      }
    });

    return true;
}