使用jQuery根據頁面上的div數量更改div的寬度

Question

更新：修改並編輯了您在下面指出的一些明顯問題。 我會變暖嗎？

$(document).ready(function(){

   var totaldivs = $('.feature').length;

   if (totaldivs == 3){

removeClass().addClass('three-features');

   } else if(totaldivs == 2){

removeClass().addClass('two-features');

   } 

});

---

我是JavaScript / JQuery的新手，所以也許我想在這里做的事情有嚴重的缺陷，但我想制作一個腳本來檢查某個類上有多少個div，並更改其寬度。這些div基於存在的數字。 我計划在檢查div數組的長度后，通過將divs類更改為寬度不同的類來實現此目的。

我在哪里錯了？

我知道我必須找出IE中getElementsByClassName的另一種解決方案。

這是我的js：

var totaldivs = document.getElementsByClassName('feature');

$(document).ready(function(){

    if (features.length==3){

    $('.features').removeClass().addClass('three-features');

  } else if(features.length==2){

    $('.features').removeClass().addClass('two-features');

  } 

});

這是我的CSS

.feature {
float: left;
}
.two-features {
float: left;
width: 100px;
}
.three-features {
float: left;
width: 50px;
}

Answer 1

您定義了totaldivs但使用了您未定義的features 。 我只是這樣做：

var counts = ['one', 'two', 'three'];

$(document).ready(function() {
    var $features = $('.features');
    var className = counts[$features.length - 1] + '-features';

    $features.removeClass().addClass(className);
});

Answer 2

確保在文檔准備好后分配totaldivs。

$(document).ready(function(){    
    var totaldivs = $('.feature').length;
    // and do something smarter like @Blender pointed out
}

PS：使用Jquery樣式始終是一個壞主意，當您的應用擴展時，它會殺死您。
考慮使用CSS，例如：
顯示：表格單元格等