Question

我正在将图像元素直接创建为div。

var myDiv = document.getElementById("myDiv");
function createImages(){
  for(var i = 0, piece = 1; i < 10; i++){
    for(var j = 0; j < 10; j++, piece++){
        var lin = i*100, col = j*100;
        var img = document.createElement("IMG");
        img.src = '../'+piece+'.jpg';
        img.style.position = "absolute";
        img.style.top = ''+lin+'px';
        img.style.left = ''+col+'px';                       
        img.style.border = '1px solid #000000';                     
        myDiv.appendChild(img);
    }
  }
}

这很好用！现在我正在尝试给图像一个onclick事件，该事件调用一个改变某些属性的函数，但我不知道我是否正确地添加了onclick事件。

img.onclick = change();

此外，我不知道如何在更改生效后自动重新渲染图像。

它必须是简单的Javascript。

任何帮助将不胜感激！

Answer 1

更改

img.onclick = change();

到

img.onclick = change;

在第一种情况下，您要将change()功能返回的值分配给onclick。在第二种情况下，您将change功能本身分配给onclick。

此外，您的代码无需主动进行任何重新渲染。当您操作DOM时，浏览器会为您处理此事。

更改元素属性并重新渲染

1 个答案: