Есть ли способ динамически вставить абсолютно позиционированный элемент HTML таким образом, который совместим с IE?

Question

Вот мой код JavaScript:

function BuildObject(container, index, imgFile, left, top, width, height) 
{ 
    var newImg = document.createElement('img'); 
    newImg.setAttribute("id","d" + index); 
    newImg.setAttribute("src", imgFile); 
    newImg.setAttribute("style", "position:absolute; left:" + left + "px; top:" + top + "px"); 
    newImg.setAttribute("width", width); 
    newImg.setAttribute("height", height); 
    container.insertBefore(newImg, container.firstChild); 
} 

BuildObject(document.body, 1, "pixel.gif", 100, 100, 1, 1); 

В Google Chrome, это порождает следующий код в качестве первого элемента в организме:

<img id="1" src="pixel.gif" style="position:absolute; left:100; top:100; " width="1" height="1"> 

Это работает, как ожидалось в Google хром, но не в IE , В IE он создает элемент, но позиционирует каждый элемент относительно в верхнем, левом углу, рядом друг с другом. Если я создаю теги вручную в HTML, IE позиционирует их правильно, но не, если я делаю это с помощью JavaScript.

Любые идеи относительно того, как я могу сделать это динамически, чтобы он работал в IE?

Answer 1

Вместо установки «стиль» атрибут, как это, сделать это:

newImg.style.position = 'absolute'; 
newImg.style.left = left + 'px'; 

и т.д. В общем использовании setAttribute() как это не совсем правильно. Задайте свойства объекта DOM напрямую, если только вы не работаете с нестандартными атрибутами, добавленными в разметку HTML.