Latest web development tutorials
×

JavaScript curso

JavaScript curso JavaScript breve introducción JavaScript uso JavaScript exportación JavaScript gramática JavaScript declaraciones JavaScript nota JavaScript variable JavaScript Tipos de datos JavaScript objetos JavaScript función JavaScript alcance JavaScript evento JavaScript cadena JavaScript operadores JavaScript comparar JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript tipo de conversión JavaScript Las expresiones regulares JavaScript error JavaScript depuración JavaScript variable de elevación JavaScript Modo estricto JavaScript El uso inapropiado JavaScript autenticación de formularios JavaScript Palabras clave reservadas JavaScript JSON JavaScript void JavaScript Especificación código

JS función

JavaScript definición de la función JavaScript Argumentos de función JavaScript llamada a la función JavaScript Los cierres

JS HTML DOM

DOM breve introducción DOM HTML DOM CSS DOM evento DOM EventListener DOM elemento

JS Tutorial avanzado

JavaScript objetos JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp objetos

JS navegador BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript música pop JavaScript Evento cronometrado JavaScript Cookies

JS almacén

JavaScript almacén JavaScript prueba jQuery JavaScript prueba Prototype

JS Ejemplos

JavaScript Ejemplos JavaScript instancia de objeto JavaScript instancia de objeto del navegador JavaScript HTML DOM Ejemplos JavaScript resumen

JS Manual de referencia

JavaScript objetos HTML DOM objetos

JavaScript HTML DOM

A través del DOM HTML, el acceso a todos los elementos del documento HTML JavaScript.


HTML DOM (Document Object Model)

Cuando se carga la página, el navegador va a crear el modelo de objetos de documento de página (Document Object Model).

modelo DOM HTML está estructurado como un árbol de objetos:

árbol DOM HTML

árbol DOM HTML

modelo de objetos programables, JavaScript ganó suficiente capacidad de crear HTML dinámico.

  • JavaScript puede cambiar la página de todos los elementos HTML
  • JavaScript puede cambiar la página HTML todos los inmuebles
  • JavaScript puede cambiar la página de todos los estilos CSS
  • JavaScript puede reaccionar a toda página de eventos

Encontrar los elementos HTML

Por lo general, JavaScript es necesario para manipular los elementos HTML.

Con el fin de hacer esto, primero debe encontrar el elemento. Hay tres maneras de hacer esto:

  • Encontrar los elementos HTML de Identificación
  • Encontrar los elementos HTML de nombre de etiqueta
  • Encontrar los elementos HTML de nombre de la clase

Encontrar los elementos HTML de Identificación

Encontrar los elementos HTML en el DOM La forma más sencilla es mediante el uso de Identificación del elemento.

Este ejemplo busca Identificación del elemento = "intro":

Ejemplos

var x = document.getElementById ( "Intro");

Trate »

Si encuentra el elemento, el método será el objeto de la forma (x en) los devuelve dicho elemento.

Si no se encuentra el elemento, entonces x contendrá nulo.


Encontrar los elementos HTML de nombre de etiqueta

En este ejemplo se encuentra id = "principales" elementos y, a continuación, busque el elemento id = "principal" en todos los elementos <P>:

Ejemplos

var x = document.getElementById ( "principal");
var y = x.getElementsByTagName ( "p");

Trate »


Encontrar los elementos HTML de nombre de la clase

En este caso, porgetElementsByClassName función para encontrar la clase = elemento de "intro":

Ejemplos

var x = document.getElementsByClassName ( "Intro");

Trate »


DOM HTML Tutorial

En este tutorial las páginas siguientes, usted aprenderá:

  • Cómo cambiar el contenido del elemento HTML (innerHTML)
  • Cómo cambiar el estilo de los elementos HTML (CSS)
  • Cómo evento HTML DOM de una reacción
  • ¿Cómo puedo añadir o eliminar elementos HTML