Método HTML DOM insertAdjacentHTML()
Ejemplo
Inserte un nuevo elemento <p> después del elemento de encabezado:
var h = document.getElementById("myH2");
h.insertAdjacentHTML("afterend",
"<p>My new paragraph</p>");
Definición y uso
El insertAdjacentHTML()
método inserta un texto como HTML, en una posición específica.
Los valores de la posición legal son:
"después del comienzo"
"después del final"
"antes del comienzo"
"antes del final"
Compatibilidad con navegador
Los números en la tabla especifican la primera versión del navegador que soporta totalmente este método.
Method | |||||
---|---|---|---|---|---|
insertAdjacentHTML() | 1 | 4 | 8 | 4 | 7 |
Sintaxis
node.insertAdjacentHTML(position, text)
Valores paramétricos
Parameter | Type | Description |
---|---|---|
position | String | Required. A position relative to the element. Legal values: "afterbegin" - After the beginning of the element (as the first child) "afterend" - After the element "beforebegin" - Before the element "beforeend" - Before the end of the element (as the last child) |
text | String | The text you want to insert |
Más ejemplos
Ejemplo
Usando el valor "después de comenzar":
h.insertAdjacentHTML("afterbegin", "<span style='color:red'>My span</span>");
Ejemplo
Usando el valor "antes de comenzar":
h.insertAdjacentHTML("beforebegin", "<span style='color:red'>My span</span>");
Ejemplo
Usando el valor "beforeend":
h.insertAdjacentHTML("beforeend", "<span style='color:red'>My span</span>");