eliminar - remove html jquery

jQuery, obtiene html de un elemento completo

Question

Esta pregunta ya tiene una respuesta aquí:

• Obtener HTML externo del elemento seleccionado 27 respuestas

Deseo obtener todo el html de un elemento seleccionado, no solo sus contenidos. .html () usa javascripts método innerHTML () según la documentación. HTML:

<div id="divs">
<div id="div1">
<p>Some Content</p>
</div>
<div id="div2">
<p>Some Content</p>
</div>
</div>

Usando $(''#divs:first'').html(); devolverá solo el elemento de párrafo. Quiero obtener el html para todo el elemento, así:

 <div id="div1">
<p>Some Content</p>
</div>

No puedo usar .parent porque devolverá html de ambos divs secundarios.

Answer 1

Las diferencias pueden no ser significativas en un caso de uso típico, pero usando la funcionalidad DOM estándar

$("#el")[0].outerHTML

es aproximadamente el doble de rápido que

$("<div />").append($("#el").clone()).html();

así que iría con:

/*
* Return outerHTML for the first element in a jQuery object,
* or an empty string if the jQuery object is empty;
*/
jQuery.fn.outerHTML = function() {
return (this[0]) ? this[0].outerHTML : '''';
};

Answer 2

Puede clonarlo para obtener todo el contenido, como este:

var html = $("<div />").append($("#div1").clone()).html();

O hágale un plugin, la mayoría tiende a llamar a esto "outerHTML", así:

jQuery.fn.outerHTML = function() {
return jQuery(''<div />'').append(this.eq(0).clone()).html();
};

Entonces solo puedes llamar:

var html = $("#div1").outerHTML();

Answer 3

Puede lograr eso con solo un código de línea.

$ (''# divs''). get (0) .outerHTML;

Tan sencillo como eso.

Answer 4

Puede obtener fácilmente el propio hijo y todos sus descendientes (hijos) con el método Jquery''s Clone (), solo

var child = $(''#div div:nth-child(1)'').clone();
var child2 = $(''#div div:nth-child(2)'').clone();

Obtendrá esto para la primera consulta como se le preguntó en cuestión

<div id="div1">
<p>Some Content</p>
</div>

Answer 5

escribe tu html así:

<div id="element">
<img src="image.jpg">
</div>

¡entonces la función .html () obtiene la etiqueta img! y puedes agregar en cualquier lugar :)