将Div放入Div中，具有特定的边距（10px）

Question

我尝试制作这样的网页（全屏）： 而且每一个的颜色应该每秒随机变化。

这是我的JS：

<script>
        var tid = setInterval(chngColor, 1000);

        function chngColor() 
        {
            document.body.style.backgroundColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
        }
    </script>

现在我尝试制作一个全屏div（与身体一样大）并将其他div放在第一个div中，边距为：每边10px。我无法弄清楚div的风格。

        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background-color="myFunction();";
        z-index: 10;
        margin-bottom:10px;
        margin-top:10px;
        margin-left:10px;
        margin-right:10px;

这不起作用吗？

Answer 1

您无法在CSS代码中使用JavaScript函数。你应该做的是在你要改变它的每个元素上使用你的chngColor函数。

更改您的功能以dom element作为参数

    function chngColor(el) 
    {
        el.style.backgroundColor = '#' + (Math.random()*0xFFFFFF<<0).toString(16);
    }

假设你的元素有一个共同的特定类，让我们说＆＃34; foo＆＃34;，你可以迭代它们并为每一个使用函数：

var foos = document.getElementsByClassName('foo');

for(var i=0; i <foos.length;i++){
  chngColor(foos[i]);
}

将它放在一个函数中，这样你就可以在setInterval中使用，你就可以了。