Программирование > JavaScript & JScript

Динамическое создание элемента

(1/2) > >>

Lucent:
Есть картинка в тексте (без div, span возле нее).
Необходимо динамически создать (над/под ней ) новый элемент, скажем DIV c текстом.

пробую так, но не получается
насколько я понимаю, img - не контейнер и добавить дочерний узел не получится


   var im=document.getElementById(\'im\') ;
   var childEl=document.createElement("div");
   var txtNode=document.createTextNode(\'456\');
   childEl.appendChild(txtNode);
   im.appendChild(childEl);

andymc:
Действительно, в справке написано, что appendChild() действует только если нужный элемент (img в данном случае) способен contain child nodes (иметь детей?...)

Альтернативный вариант с абсолютным позиционированием

--- Код: ---




function get(id){
return document.getElementById(id);
}
im = get(\'im\')

x = im.offsetLeft
y = im.offsetTop
h = im.height
w = im.width

base = get(\'head\')
block = document.createElement(\'div\')
block.innerHTML = \'Всем привет\'
base.appendChild(block)
block.style.position = \'absolute\'
block.style.left = x
block.style.top = y + h


--- Конец кода ---

CGVictor:
Lucent
Да, создание в base_object (только все же body, наверно) сработает.

Некрасивый вариант img.outerHTML += \'\' не подойдет в даном случае?

andymc:
CGVictor
outerHTML - NN n/a (то есть только для IE)

hanslinger:
можно после картинки сделать insertAfter, вставить туда DIV с position: relative; width: imgOffestWidth; height: imgOffsetHeight; left: -imgOffsetWidth; top: -imgOffsetHeight;
В самом простом случае это должно сработать.

Можно присвоить всем этим картинкам класс и на onload заменять их на дивы с соответствующим бэкграундом.

Можно вставлять перед картинкой див, а потом аппендить в этот див картинку (тогда она исчезнет из своего первоначального места)

Вариантов-то тонна :)

Навигация

[0] Главная страница сообщений

[#] Следующая страница