1. Home
  2. elementos DOM JavaScript HTML

El mejor tutorial de elementos DOM JavaScript HTML en 2024. En este tutorial podrás aprender Crear un nuevo elemento HTML,Ejemplos,Ejemplos de análisis:,Quitar los elementos HTML existentes,Ejemplos,Ejemplos de analítica,DOM HTML Tutorial,

elementos DOM JavaScript HTML

Crear un nuevo elemento HTML

Crear un nuevo elemento HTML

Para añadir un nuevo elemento a la DOM HTML, primero debe crear el elemento (un nodo elemento), y luego añadir el elemento a un elemento existente.

Ejemplos

<Div id = "div1">
<P id = "p1"> Esto es un párrafo. </ P>
<P id = "p2"> Este es otro párrafo. </ P>
</ Div>

<Script>
var = document.createElement párrafo ( "p");
nodo var = document.createTextNode ( "Este es un párrafo nuevo.");
para.appendChild (nodo);

var element = document.getElementById ( "div1");
element.appendChild (para);
</ Script>

Trate »

Ejemplos de análisis:

Este código crea un nuevo elemento <p>:

var para=document.createElement("p");

Para añadir texto al elemento <p>, primero debe crear un nodo de texto. Este código crea un nodo de texto:

nodo var = document.createTextNode ( "Este es un párrafo nuevo.");

A continuación, debe agregar este nodo de texto para el elemento <p>:

para.appendChild (nodo);

Por último, debe agregar este nuevo elemento a un elemento existente.

El código para encontrar un elemento existente:

var element = document.getElementById ( "div1");

El código siguiente después de los elementos existentes añadir un nuevo elemento:

element.appendChild (para);

Quitar los elementos HTML existentes

El código siguiente muestra cómo eliminar elementos:

Ejemplos

<Div id = "div1">
<P id = "p1"> Esto es un párrafo. </ P>
<P id = "p2"> Este es otro párrafo. </ P>
</ Div>

<Script>
var matriz = document.getElementById ( "div1");
var niño = document.getElementById ( "P1");
parent.removeChild (niño);
</ Script>


Trate »

Ejemplos de analítica

El documento HTML que contiene los nodos hijos tienen (dos elemento <p>) dos de los elementos <div>:

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

Encuentra id = "elementos" Div1:

var matriz = document.getElementById ( "div1");

Encuentra Identificación del elemento <P> = "p1":

var child=document.getElementById("p1");

Retirar del elemento padre sub-elementos:

parent.removeChild(child);

lámpara Si se puede quitar un elemento sin una referencia al elemento padre, que sería grande.
Pero, por desgracia. elementos DOM que usted necesita saber para ser eliminados, así como su elemento padre.

Esta es una solución común: encontrar el elemento secundario que desea borrar, y luego usar sus propiedades para encontrar parentNode elemento padre:

var child=document.getElementById("p1");
child.parentNode.removeChild(child);

DOM HTML Tutorial

En la parte HTML DOM de nuestro tutorial JavaScript, que ha aprendido:

  • Cómo cambiar el contenido del elemento HTML (innerHTML)
  • Cómo cambiar el estilo de los elementos HTML (CSS)
  • Cómo reaccionar a los eventos en el DOM HTML
  • ¿Cómo puedo añadir o eliminar elementos HTML

Si desea obtener más información sobre el uso de JavaScript para acceder al conocimiento de HTML DOM, por favor visite nuestro completo tutorial HTML DOM .

Hot Tutorials

Contact US

elementos DOM JavaScript HTML
10/30