html javascript2

6

Click here to load reader

Upload: henry-renderos

Post on 12-Jun-2015

133 views

Category:

Documents


3 download

TRANSCRIPT

Page 1: Html javascript2

DATA SYSTEMS COMPUTADORASMÓDULO: HTML y JavascriptInstructor: Br. Henry Renderos

A continuación desarrollaremos ejercicios incluyendo Javascript.

Javascript es un lenguaje de scripting de la web. Todas las páginas HTML modernas están usando Javascript. Javascript se ejecuta del lado del cliente.

Ejercicio 1: Este es el primer ejercicio que realizará utilizando HTML5 y

Javascript, al final responda las preguntas en su cuaderno

.

Page 2: Html javascript2

PREGUNTAS

1. ¿Qué sucede cuando hace click al botón?2. ¿Cómo empieza y termina un script?

Ejercicio 2: El siguiente ejercicio muestra cómo escribir etiquetas HTML

desde Javascript. Luego responda en su cuaderno las preguntas.

PREGUNTAS1. ¿Qué función de Javascript sirve para escribir en el documento?2. Escriba un ejemplo usted mismo.

Ejercicio 3: La salida de un script de Javascript puede escribirse dentro de

una etiqueta, realice el ejercicio y responda las preguntas.

Page 3: Html javascript2

PREGUNTAS1. ¿Qué es lo que se muestra en la página web?2. ¿Qué sucede si colocamos el bloque <script></script> sobre la etiqueta <p>?

El atributo “id” dentro de la etiqueta <p> sirve para identificar el elemento para que pueda ser utilizado por Javascript. Note que dentro del script se hace referencia a él.InnerHTML sirve para que pueda colocar texto u otros elementos o atributos dentro de una etiqueta.

Ejercicio 4: Cambiar el estilo, color y tamaño de la letra con Javascript.

Responda las preguntas.

Page 4: Html javascript2

PREGUNTAS1. ¿Cuál es el código que sirve para cambiar el color con Javascript?2. ¿Cuál es el código que sirve para cambiar el tipo de letra con Javascript?3. ¿Cuál es el código que sirve para cambiar el tamaño de letra con Javascript?4. Agregue un nuevo botón y una función para cambiar el color de la letra a ROJO, el tipo de letra a VERDANA y el tamaño de la letra a 46px.

Ejercicio 5: Un convertidor de moneda con HTML5 y Javascript

Indicaciones: 1. Abra el bloc de notas.2. Guarde el archivo con el nombre “convertidor.html”3. Transcriba el código de la siguiente página, intente no cometer errores.4. Pruebe su página web en el navegador web.

Page 5: Html javascript2
Page 6: Html javascript2

EJERCICIOS PROPUESTOS1. Elabore una página web con HTML5 y Javascript en la que pulsando un botón cambie el color, tamaño y tipo de letra de su nombre, y otro botón que lo desaparezca (deje la página en blanco).2. Elabore una página web con HTML5 y Javascript en la que capture 2 números de cuadros de texto de un formulario y los sume, y que el resultado de esta suma la muestre en un encabezado con color de letra VERDE.3. Elabore una página web con HTML5 y Javascript en la que capture su año de nacimiento de un cuadro de texto y calcule su edad mostrándola en un encabezado con color de letra AZUL.4. Elabore una página web con HTML5 y Javascript en la que capture el valor en dólares de un cuadro de texto y haga la conversión a Córdobas, Euros, Lempiras, Quetzales y Colones.

Puede guiarse con el siguiente contenido web.

http://w3schools.com/js/default.asp