Please enable JavaScript to use CodeHS

Diseño y Desarrollo Web

Description

En esta lección, los alumnos aprenden a incorporar JavaScript a sus páginas HTML utilizando la etiqueta script.

Objective

Students will be able to:

  • Incorporate JavaScript into their HTML pages
  • Use the console to debug scripts
Description

En esta lección, los alumnos aprenden a modificar las etiquetas HTML de una página web utilizando el DOM. El DOM, o Modelo de Objetos del Documento, convierte los archivos HTML en objetos accesibles que pueden manipularse o añadirse a una página web.

Objective

Students will be able to:

  • Modify existing elements on a web page using document.getElementById
  • Modify existing elements on a web page using document.getElemenyByTagName
  • Explain the purpose of the DOM, and how it is used to manipulate HTML files
Description

En esta lección, los alumnos aprenderán a crear elementos utilizando el Modelo de Objetos del Documento.

Objective

Students will be able to:

  • Create elements using document.createElement
  • Add created elements to an existing webpage
Description

En esta lección, los alumnos aprenden a aplicar estilos a elementos en HTML utilizando JavaScript y el Modelo de Objetos del Documento.

Objective

Students will be able to:

  • Utilize setAttribute appropriately to style elements in JavaScript
  • Distinguish between .attribute and setAttribute notation and determine the advantages and disadvantages of both
Description

En esta lección, los alumnos aprenden a utilizar funciones para hacer más dinámicas sus páginas web.

Objective

Students will be able to:

  • Articulate the difference between dynamic and static websites
  • Create buttons with onclick events
  • Use functions to create working, dynamic buttons
Description

En esta lección, los alumnos aprenden a utilizar la palabra clave this para pasar elementos como parámetros en sus eventos de clic.

Objective

Students will be able to:

  • Appropriately use the keyword this
  • Explain the difference between how this is used with onclick and with eventListeners
Description

En esta lección, los alumnos pondrán en práctica las habilidades que han aprendido en las lecciones anteriores para crear un teclado que funcione y en el que se pueda hacer clic.

Objective

Students will be able to:

  • Create a working, clickable keyboard using only JavaScript
Description

En esta lección, los alumnos aprenden sobre otro oyente de eventos: las interacciones del teclado. Los alumnos aprenden a escuchar la pulsación de un teclado y a acceder a la información sobre cada pulsación.

Objective

Students will be able to:

  • Use keydown and keyup events to read keyboard information
  • Distinguish between key.code and key.key, and when it’s appropriate to use each
Description

En esta lección, los alumnos aprenden a animar elementos de páginas web utilizando temporizadores.

Objective

Students will be able to:

  • Describe what animation is, and how it works
  • Use timers to successfully animate web page elements and terminate animations
Description

En esta lección, los alumnos aprenden a utilizar el estilo position de CSS para mejorar las animaciones.

Objective

Students will be able to:

  • Explain the difference between all the position attributes
  • Use position to animate elements
Description

En esta lección, los alumnos testan sus conocimientos de los conceptos de este módulo con un cuestionario de la unidad.

Objective

Students will be able to:

  • Prove their knowledge of JavaScript in HTML through a multiple choice quiz