Ejemplos DHTML

Colección de ejemplos sobre el DOM muy simples donde se muestra como manejar el documento web con javascript. Es donde puedes aprender a aplicar Javascript a tus páginas web.

Contador de clicks

En este ejemplo se crea un botón que muestra el número de veces que se ha pulsado. Cada vez que se hace click encima se muestre en su etiquete al nçumero de clicks hasta ese momento.

Es un ejemplo simple donde se muestra el uso de los eventos y del DOM

Cambio de imágenes con efecto mosaico

En este ejemplo te muestro como puedes crear un efecto de carrusel estático donde una imagen es sustituida por otra como si ambas estuvieran formadas por mosaicos

Crear nodos

En este ejemplo se crean dinámicamente el título de una página, una cabecera h1 y un párrafo con texto y atributo de estilo cursiva.

Crear nodo imagen

Agregar un  nodo tipo imagen a un bloque div existent, añadiendo el valor a su atributo src para que se muestre en la página.

Eliminar nodo

En este ejemplo se busca un elemento de la página web  por su atributo Id y se elimina de la página.

Buscar elemento

Se trata de localizar un bloque div de la página web y cambiarle el color del fondo pulsando sobre un botón. También se usan eventos.

Selector CSS

Se trata de obtener el contenido de texto de un elemento y copiarlo en otro vacío. El script se lanza con un evento onclick sobre un botón..

Elemento por nombre

Seleccionar varios elementos de la página por su atributo name. Útil para el procesamiento de formularios.

Seleccionar por Tags

Una página tiene tres elementos h2. Al pulsar un botón se les cambia el color a cada uno: primero rojo, segundo azul y el tercero naranja.

Selector por Class

Vamos a seleccinar elementos por su atributo class para leer su contenido y copiarlo en un bloque div vacío.

Selección global con CSS

En una página vamos a selecccionar todos los encabezados h3 y h4, y los vamos a cambiar de color.