Javascript JS：图像网格和onclick事件_Javascript

Javascript JS：图像网格和onclick事件

javascript

Javascript JS：图像网格和onclick事件,javascript,Javascript,我是JS新手，这是我在这里的第一篇帖子。。。我正在尝试创建一个图像网格（都一样），当用户单击其中一个图像时，我需要执行一个函数。希望我的代码不是一团糟： cellWidth = 42; cellHeight = 42; rownumber = 10; columnnumber = 15; leftmargin = 500; topmargin = 150; for (var i = 0; i < rownumber; i++) { for (var x = 0; x <

我是JS新手，这是我在这里的第一篇帖子。。。我正在尝试创建一个图像网格（都一样），当用户单击其中一个图像时，我需要执行一个函数。希望我的代码不是一团糟：

cellWidth = 42;
cellHeight = 42;
rownumber = 10;
columnnumber = 15;
leftmargin = 500;
topmargin = 150;

for (var i = 0; i < rownumber; i++) {
    for (var x = 0; x < columnnumber; x++) {
    var cell = new Image();
    cell.src = "black.png";
    cell.style.position = "absolute";
    cell.id = x+"x"+i;
    cell.style.left = x * cellWidth + leftmargin - cellWidth*i;
    cell.style.top = i * cellHeight + topmargin;
    cell.onclick=function(){alert("Hello World")};
    document.body.appendChild(cell);
}   
}

cellWidth=42；
细胞高度=42；
行数=10；
列数=15；
左边距=500；
topmargin=150；
对于（变量i=0；i


我也尝试过使用cell.addEventListener，但什么也没发生
编辑：不知怎的，它在firefox上正好正常工作。
我的代码或浏览器有问题吗
 这对我很有效……问题可能是你把脚本放在哪里了。如果您将它放在
部分，它将无法像编写的那样工作，因为document.body
还不存在。尝试在
元素的末尾添加。换言之：
<head>
    <script>
        // document.body will be null
    </script>
</head>
<body>
    <script>
        // document.body good to go
    </script>
</body>

这应该是问题所在的线索。当你遇到问题时，一定要先看控制台：它可能会准确地告诉你需要知道的内容。没有……我已经把它放在身体里了。。。此外，控制台完全静音！编辑：什么…它在firefox上工作！是的，你说得对，对不起。我已经在chrome和firefox上试过了，它只在firefox上有效。它不在chrome上。你在chrome上看到了什么？空白文件？有任何控制台错误吗？我有网格，没有任何警报。没有控制台错误。你有网格吗？代码不应该生成网格吗？那么，到底是什么不起作用呢？
Uncaught TypeError: Cannot call method 'appendChild' of null