在tds Javascript中放置背景颜色

时间:2013-12-10 06:44:45

标签: javascript

我正在尝试更改阵列中可用的背景颜色。 tds也是使用javascript代码创建的,但现在我想使用js设置背景颜色,这是没有发生的。

下面是我的代码。感谢。

 <html>
    <head>Colour Memory Game</head>
    <body onload = "myFrame()";>
    <p id="demo", onload = "distributeColors()";></p>
    </body>
    <script>

        var rows = 4; //cards side by side
        var columns = 4; //cards in vertical
        var z = rows*columns;

        var arrColors = ["#3be6c4","#e6e03b","#6f3be6","#4fe63b","#e63b3b","#ff5a00","#ff00de","#3b8fe6"];  //array of colors


        // creating a div for gameboard to be prepared  
        div = document.createElement("div");    
        div.style.width = "800";
        div.style.height = "800";
        div.style.background = "purple";
        div.id = "frame";
        //div.onload = "myFrame()";
        document.getElementsByTagName('body')[0].appendChild(div);



        //preparing a frame
        function myFrame(){
            var frame = document.createElement("table");
            var body = document.createElement("tbody");


            for(i=0; i<rows; i++){
                var r = document.createElement("tr");
                r.style.width = "200";
                r.style.height = "150";
                r.style.background = "white";

                for(j=0; j<columns; j++){
                    c = document.createElement("td");
                    c.style.width = "200";
                    c.style.height = "150";
                    c.style.background = "white";
                    c.id = "cards";
                    r.appendChild(c);
                    };
                    body.appendChild(r);
            };
            frame.appendChild(body);
            document.getElementById('frame').appendChild(frame);
            return c;
        };

    /*placement of colors into each card*/
    //function randomDistribution(backgroundcolors) {
    var colors = arrColors.concat(arrColors); //array of colors to be used
    //colorString = colors.toString();
    for (i=0; i<=colors.length; i++){
        document.getElementById('cards').style.background = color[Math.floor(Math.random()*colors.length)];

        };  


</script>

</html>

1 个答案:

答案 0 :(得分:0)

首先检查这一行

<body onload = "myFrame()";>
<p id="demo", onload = "distributeColors()";></p>

正确的是

<body onload = "myFrame();">
<p id="demo" onload = "distributeColors();"></p>

并尝试

c.style.backgroundColor="#fff"; 

并且没有必要“返回c;”最后。