замещающий JavaScript элемент DOM

Question

Я хотел бы сделать что-то вроде:

var htmlcode = '<div>testing</div>';
document.getElementById('initDiv').html = htmlcode;

вроде как использует innerHTML, но заменяет сам элемент.

Может кто-нибудь помочь мне, пожалуйста? спасибо

Answer 1

Нет, нет кросс-браузерного решения вашей проблемы. Лучшее, что вы могли бы сделать, это собрать воедино что-то, что будет работать в кросс-браузерной манере.

Вот одно из решений:

function outerHTML( el, html ) {
    if ( 'outerHTML' in el ) {   // for most browsers
        el.outerHTML = html;
    } else {                     // for Firefox
        var temp = document.createElement('div');
        temp.innerHTML = html;
        while (temp.firstChild) {
            el.parentNode.insertBefore( temp.firstChild, el );
        }
        el.parentNode.removeChild(el);
    }
};

Используйте это так:

var initDiv = document.getElementById('initDiv');

outerHTML( initDiv, '<div>testing</div>' );

Пример: http://jsfiddle.net/6VUNU/1/

Answer 2

Вы всегда можете найти родителя initDiv, createElement ('div'), заполнить его htmlcode, а затем удалитьElement в initDiv.

Answer 3

Есть значение document.getElementById(...).outerHTML, которое вы можете использовать, но, насколько я помню, его нельзя использовать во всех браузерах.