使用if語句控制html在div中的位置來自javascript

Question

我在javascript中有一個數組。 HTML在屏幕上的div中打印數組的元素。但我希望div的位置根據數組中元素的數量而改變。我使用CSS邊距和填充來控制屏幕上div的位置。那麼如何做到這一點呢？必須有某種方式，但我無法想到任何。也許我需要使用其他的東西，完全單獨的表單javascript。

如果CSS和JavaScript凌晨起來會是這個樣子：

div{ 

    margin: 100*array.length px; 

} 

或

if(array.length > 3){ 

    margin:400px; 

    }else{ 

    margin:200px; 

    } 

如果有一個更簡單的方法，而不是使用margin和padding，讓我知道。如果我必須從我的代碼開始，請告訴我。 我知道它不會接近這個簡單的。但是做到這一點最簡單的方法是什麼？我應該學習什麼才能做到這一點。感謝任何答案。

Answer 1

你幾乎擁有了...

document.getElementById('mydiv').style.margin = 100 * array.length + 'px'; 

Answer 2

添加基於陣列長度的CSS類 - 例如，如果你把該值在數組myArrayLength，那麼你可以使用jQuery做到這一點。

if (myArrayLength > 3) { 
    $('div').addClass('wider'); 
} 

在CSS

div { 
    width:300px; 
} 
div.wider { 
    width:600px; 
}