jQuery: implementare la proprietà outerHTML di Internet Explorer

  • jQuery
  • Gabriele Romanato

jQuery dispone del metodo html() per leggere e scrivere il contenuto HTML di un elemento. Questo metodo, tuttavia, ha un limite: non restituisce l'elemento HTML su cui viene usato. Nello specifico, jQuery utilizza la proprietà innerHTML e non outerHTML, in quanto quest'ultima è proprietaria di Internet Explorer. Possiamo tuttavia ovviare al problema con facilità. Vediamo come.

Creiamo il seguente plugin:


(function($) {

    $.fn.extend({
        toHTMLString: function() {
            return $('<div>').append(this.clone()).remove().html();
        }
    });
})(jQuery);

Quindi, data la seguente marcatura:


<p id="test"><span>Test</span></p>

Possiamo usare il plugin come segue:


$('#run').click(function() {
    var htmlString = $('#test').toHTMLString();
    alert(htmlString); // <p id="test"><span>Test</span></p>
});​

Potete visionare l'esempio finale in questa pagina.

Torna su