0
<!DOCTYPE html>
<html>
<head>
    <title>Anti Chess</title>
</head>
<body>
    <h1 id="game_title">Anti Chess by theManikJindal</h1>
    <br />
    <br />

    <table id="game"></table>
    <script>
        var white = 1;
        var ta = document.getElementById("game");
        if(white == 1)
        {
            for(var i=0;i<8;i++)
            {
                var x = document.createElement('tr');
                ta.appendChild(x);
                for(var j=0;j<8;j++)
                {
                    var y = document.createElement('td');
                    ta.childNodes[i].appendChild(y);
                    ta.childNodes[i].childNodes[j].setAttribute("id",String.fromCharCode(j+97)+(8-i).toString());
                }

            }

        }
        else
        {
            for(var i=0;i<8;i++)
            {
                var x = document.createElement('tr');
                ta.appendChild(x);
                for(var j=0;j<8;j++)
                {
                    var y = document.createElement('td');
                    ta.childNodes[i].appendChild(y);
                    ta.childNodes[i].childNodes[j].setAttribute("id",String.fromCharCode(104-j)+(i+1).toString());
                }

            }

        }
    </script>
</body>
</html>

我不明白为什么这个脚本不起作用。是否有任何好的 Javascript 调试器,或者是否必须继续将头撞到墙上才能有意义。

请帮忙

该脚本应该创建一个包含 8x8 框的表格,并且属性 id 应该从“a8”、“b8”、“c8”...“h8”设置为“a1”、“b1”、“c1”.. ."h1" . 对于白色的值为 1 时的 a。并且从 "h","g1","f1"..."a1" 到 "h8","g8",..."a8" 为白色不等于 1 . white =1 目前是默认值。

4

4 回答 4

3

表必须始终具有至少一个<tbody>元素。如果没有,浏览器将创建一个。

这意味着您的整个childNodes访问权限都是错误的。

我会建议这个 HTML:

<table><tbody id="game"></tbody></table>

这应该使您的代码工作,但您可以进一步简化它:

var white = 1, a = "a".charCodeAt(0), i, j, x, ta = document.getElementById("game");
for(i=0;i<8;i++) {
    x = document.createElement('tr');
    for(j=0;j<8;j++)
        x.appendChild(document.createElement('td')).id =
               String.fromCharCode((white == 1 ? j : 8-j)+a)+(white == 1 ? 8-i : i+1);
    ta.appendChild(x);
}

如您所见,通过将white == 1检查移动到最相关的位置,我消除了重复整个代码块的需要。我还更多地使用了该x引用,并且我已经将“神奇”值替换为稍后返回时更容易理解的值(a变量)。

希望这可以帮助!

编辑:另外,我刚刚注意到表格没有内容 - 这就是你的意思是它没有出现吗?确保您有合适的 CSS 以使表格单元格可见。

于 2013-05-05T19:32:28.967 回答
1

这个脚本工作正常。我在 jsfiddle 中检查了元素,发现创建了元素。

我使用了一些 css 来显示已经创建了盒子。

css

table{
border:1px solid black;
}
table tr, td{
border:1px solid black;
}

见这里http://jsfiddle.net/9uHPx/

于 2013-05-05T19:34:02.923 回答
1

Java 脚本正在运行,但表格未显示。

在表格中添加边框=1

于 2013-05-05T19:34:09.687 回答
0

脚本工作正常。添加了几个循环,以便 ID 将打印到 td 标记中,以便您查看发生了什么。http://jsfiddle.net/5YRKx/

        var tableTemp = document.getElementById("game");

    for (var ii = 0, row; row = tableTemp.rows[ii]; ii++) {
       //iterate through rows
       //rows would be accessed using the "row" variable assigned in the for loop
       for (var j = 0, col; col = row.cells[j]; j++) {
        row.cells[j].innerHTML  =  row.cells[j].id;
       }  
    }
于 2013-05-05T20:22:39.420 回答