From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- files/es/web/api/element/outerhtml/index.html | 143 ++++++++++++++++++++++++++ 1 file changed, 143 insertions(+) create mode 100644 files/es/web/api/element/outerhtml/index.html (limited to 'files/es/web/api/element/outerhtml') diff --git a/files/es/web/api/element/outerhtml/index.html b/files/es/web/api/element/outerhtml/index.html new file mode 100644 index 0000000000..7e9647f0db --- /dev/null +++ b/files/es/web/api/element/outerhtml/index.html @@ -0,0 +1,143 @@ +--- +title: Element.outerHTML +slug: Web/API/Element/outerHTML +translation_of: Web/API/Element/outerHTML +--- +

{{APIRef("DOM")}}

+ +

Resumen

+ +

El atributo outerHTML del interfaz DOM {{ domxref("element") }} obtiene el fragmento HTML serializado que describe el elemento incluyendo sus descendientes. Puede ser asignado para reemplazar el elemento por los nodos resultantes de examinar de la cadena proporcionada.

+ +

Sintaxis

+ +
var content = element.outerHTML;
+
+ +

Al retorno, content contendrá el fragmento de HTML serializado que describe al elemento element y a sus descendientes.

+ +
element.outerHTML = content;
+
+ +

Reemplaza el elemento por los nodos generados del análisis de la cadena content con el padre de element como el nodo de contexto para el algoritmo de procesado del fragmento.

+ +

Ejemplos

+ +

Ontener el valor de la propiedas outerHTML de un elemento:

+ +
// HTML:
+// <div id="d"><p>Content</p><p>Further Elaborated</p></div>
+
+d = document.getElementById("d");
+dump(d.outerHTML);
+
+// La cadena '<div id="d"><p>Content</p><p>Further Elaborated</p></div>'
+// es volcada a la ventana de la consola.
+
+ +

Reemplazar un nodo mediante la asignación de la propiedad outerHTML:

+ +
// HTML:
+// <div id="container"><div id="d">This is a div.</div></div>
+
+container = document.getElementById("container");
+d = document.getElementById("d");
+console.log(container.firstChild.nodeName); // logs "DIV"
+
+d.outerHTML = "<p>This paragraph replaced the original div.</p>";
+console.log(container.firstChild.nodeName); // logs "P"
+
+// El div #d no será parte del árbol del documento,
+// el nuevo párrafo lo reemplazará.
+
+ +

Notas

+ +

Si el elemento no tiene elemento padre, esto es, si es el elemento raíz del documento, la asignación de su propiedad outerHTML lanzará una DOMException con el código de error NO_MODIFICATION_ALLOWED_ERR. Por ejemplo:

+ +
document.documentElement.outerHTML = "test";  // lanza una DOMException
+
+ +

Además, aunque el elemento es reemplazado en el documento, la variable cuya propiedad outerHTML fue asignada continuará conteniendo una referencia al elemento original:

+ +
var p = document.getElementsByTagName("p")[0];
+console.log(p.nodeName); // muestra: "P"
+p.outerHTML = "<div>This div replaced a paragraph.</div>";
+console.log(p.nodeName); // sigue mostrando: "P";
+
+ +

Especificación

+ + + + + + + + + + + + + + + + +
EspecificaciónEstadoObservaciones
{{SpecName('DOM Parsing', '#outerhtml', 'Element.outerHTML')}}{{ Spec2('DOM Parsing') }} 
+ +

Compatibilidad con navegadores

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
PrestaciónFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Soporte básico{{ CompatGeckoDesktop("11") }}0.24.071.3
+
+ +
+ + + + + + + + + + + + + + + + + + + +
PrestiaciónAndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
Soporte básico{{ CompatVersionUnknown() }}{{ CompatGeckoMobile("11") }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}{{ CompatVersionUnknown() }}
+
+ +

Ver también

+ + -- cgit v1.2.3-54-g00ecf