javascript - 带有样式的 IE 新元素？

Question

我有这个样式表:

.pixel{
    position: absolute;
    height: 10px;
    width: 10px;
    background-color: #ffcc00;
    font-size: 0px;
}

还有这个 javascript:

function drawpixel(x,y){
    el = document.createElement('div');
    el.setAttribute('class','pixel');
    el.style.left = x;
    el.style.top = y;
    /*  IE needs this for some reason?
    el.style.position = "absolute";
    el.style.backgroundColor = "#FFCC00";
    el.style.width = "2px";
    el.style.height = "2px";
    */
    el.style.fontSize = "0px";
    el.style.lineHeight = "0px";
    document.body.appendChild(el);
}

function mover(event){
    element = document.getElementById("coords");
    element.innerHTML = event.clientX + " " + event.clientY;
    drawpixel(event.clientX, event.clientY);
} 

这让我可以用 div 来“画图”。但是 IE 需要那 4 行注释 - 它出于某种原因不会读取类信息吗？

有没有更简单的方法来为 IE“修复”它，或者我几乎只需要这 4 行？

谢谢

Answer 1

只需使用el.className = "pixel";

只是我注意到的其他事情。我知道问题指出这是针对 IE 的，但看起来您正在事件处理程序中使用 mover(event)。如果您使用的是 Firefox 和其他浏览器，您可能需要考虑像这样编写 mover 函数:

function mover(evt){  
    evt = evt || event;                                                           
    element = document.getElementById("coords");                                 
    element.innerHTML = evt .clientX + " " + evt .clientY;                     
    drawpixel(evt.clientX, evt.clientY);                                     
}