Está en la página 1de 9

PLANTEAMIENTO DEL PROBLEMA

Qu es JavaScript? JavaScript es un lenguaje de programacin que se utiliza principalmente para crear pginas web dinmicas. Una pgina web dinmica es aquella que incorpora efectos como texto que aparece y desaparece, animaciones, acciones que se activan al pulsar botones y ventanas con mensajes de aviso al usuario. Tcnicamente, JavaScript es un lenguaje de programacin interpretado, por lo que no es necesario compilar los programas para ejecutarlos. En otras palabras, los programas escritos con JavaScript se pueden probar directamente en cualquier navegador sin necesidad de procesos intermedios. A pesar de su nombre, JavaScript no guarda ninguna relacin directa con el lenguaje de programacin Java. Legalmente, JavaScript es una marca registrada de la empresa Sun Microsystems. Cmo incluir JavaScript en documentos XHTML? Incluir JavaScript en el mismo documento XHTML

El cdigo JavaScript se encierra entre etiquetas <script> y se incluye en cualquier parte del documento. Aunque es correcto incluir cualquier bloque de cdigo en cualquier zona de la pgina, se recomienda definir el cdigo JavaScript dentro de la cabecera del documento (dentro de la etiqueta
<head>):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/ DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Ejemplo de cdigo JavaScript en el propio documento</title> <script type="text/javascript"> alert("Un mensaje de prueba"); </script> </head>

<body> <p>Un prrafo de texto.</p> </body> </html>

Para que la pgina XHTML resultante sea vlida, es necesario aadir el atributo type a la etiqueta<script>. Los valores que se incluyen en el atributo type estn estandarizados y para el caso de JavaScript, el valor correcto es text/javascript. Este mtodo se emplea cuando se define un bloque pequeo de cdigo o cuando se quieren incluir instrucciones especficas en un determinado documento HTML que completen las instrucciones y funciones que se incluyen por defecto en todos los documentos del sitio web. El principal inconveniente es que si se quiere hacer una modificacin en el bloque de cdigo, es necesario modificar todas las pginas que incluyen ese mismo bloque de cdigo JavaScript. Definir JavaScript en un archivo externo Las instrucciones JavaScript se pueden incluir en un archivo externo de tipo JavaScript que los documentos XHTML enlazan mediante la etiqueta <script>. Se pueden crear todos los archivos JavaScript que sean necesarios y cada documento XHTML puede enlazar tantos archivos JavaScript como necesite. Ejemplo: Archivo codigo.js
alert("Un mensaje de prueba");

Documento XHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/ DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Ejemplo de cdigo JavaScript en el propio documento</title> <script type="text/javascript" src="/js/codigo.js"></script> </head>

<body> <p>Un prrafo de texto.</p> </body> </html>

Adems del atributo type, este mtodo requiere definir el atributo src, que es el que indica la URL correspondiente al archivo JavaScript que se quiere enlazar. Cada

etiqueta <script> solamente puede enlazar un nico archivo, pero en una misma pgina se pueden incluir tantas etiquetas<script> como sean necesarias. Los archivos de tipo JavaScript son documentos normales de texto con la extensin .js, que se pueden crear con cualquier editor de texto como Notepad, Wordpad, EmEditor, UltraEdit, Vi, etc. La principal ventaja de enlazar un archivo JavaScript externo es que se simplifica el cdigo XHTML de la pgina, que se puede reutilizar el mismo cdigo JavaScript en todas las pginas del sitio web y que cualquier modificacin realizada en el archivo JavaScript se ve reflejada inmediatamente en todas las pginas XHTML que lo enlazan. Incluir JavaScript en los elementos XHTML

Este ltimo mtodo es el menos utilizado, ya que consiste en incluir trozos de JavaScript dentro del cdigo XHTML de la pgina:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/ DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Ejemplo de cdigo JavaScript en el propio documento</title> </head>

<body> <p onclick="alert('Un mensaje de prueba')">Un prrafo de texto.</p> </body> </html>

El mayor inconveniente de este mtodo es que ensucia innecesariamente el cdigo XHTML de la pgina y complica el mantenimiento del cdigo JavaScript. En general, este mtodo slo se utiliza para definir algunos eventos y en algunos otros casos especiales.

DESARROLLO
Realiza lo que a continuacin se te pide: 1. Utilizando la caja de dialogo prompt, la cual por default contendr el texto ES, el usuario podr introducir ES o EN.

2. De acuerdo a lo ledo por la caja de texto escribir en la pgina la fecha en el idioma seleccionado de acuerdo a la siguiente informacin:

3. Mostrar la fecha con el siguiente formato de acuerdo al idioma seleccionado (suponiendo que la fecha del sistema es: Mon Jul 1 20:19:13 CDT 2013). Para ES: Hoy es LUNES 01 DE JULIO DE 2013 son las 08:19:13 P.M. Para EN: Today is MONDAY 01 of JULY de 2013 it is 08:19:13 P.M.

NOTA: PARA AMBOS IDIOMAS EL FORMATO DE HORA SERA DE 12 HRS.

4. En el caso en el que el usuario no introduzca idioma o de clic en el botn cancelar la fecha que mostrara la pgina ser la fecha por default del sistema: Mon Jul 1 20:19:13 CDT 2013.

El cdigo para realizar esta prctica es el siguiente:


<%-Document : index Created on : 30/10/2013, 03:31:35 PM Author : ELON --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Introduccin a Javascript</title> <script type="text/javascript"> var bienvenida = prompt("SELECCIONA EL LENGUAJE: ES o EN","ES"); if(bienvenida == "ES") { var d=new Date(); var dia=new Array(7); dia[0]="Domingo"; dia[1]="Lunes"; dia[2]="Martes"; dia[3]="Miercoles"; dia[4]="Jueves"; dia[5]="Viernes"; dia[6]="Sabado"; document.write("Hoy es: " + dia[d.getDay()]); var hoy = new Date(); document.write(" "+hoy.getDate()); var mm=new Date(); var m2 = mm.getMonth() + 1; var mes = (m2 < 10) ? '0' + m2 : m2; var mes = new Array(12); mes[0]="Enero"; mes[1]="Febrero"; mes[2]="Marzo"; mes[3]="Abril"; mes[4]="Mayo"; mes[5]="Junio"; mes[6]="Julio"; mes[7]="Agosto"; mes[8]="Septiembre"; mes[9]="Octubre"; mes[10]="Noviembre"; mes[11]="Diciembre"; document.write(" De " + mes[mm.getMonth()]); var ano = new Date(); document.write(" DE "+ano.getFullYear()); var hor=new Date(); var hour=new Array(7); hour[0]="00"; hour[1]="01"; hour[2]="02"; hour[3]="03"; hour[4]="04"; hour[5]="05"; hour[6]="06"; hour[7]="07"; hour[8]="08"; hour[9]="09"; hour[10]="10"; hour[11]="11"; hour[12]="12"; hour[13]="01"; hour[14]="02"; hour[15]="03"; hour[16]="04"; hour[17]="05"; hour[18]="06"; hour[19]="07"; hour[20]="08"; hour[21]="09";

hour[22]="10"; hour[23]="11"; if(hor > 12) { document.write(" son las " + hour[hor.getDay()+2]+":"+hor.getMinutes()+":"+hor.getSeconds()+" P.M."); } else if(hor < 12) { document.write(" son las " + hour[hor.getDay()+2]+":"+hor.getMinutes()+":"+hor.getSeconds()+" A.M."); }

} else if(bienvenida == "EN") { var d=new Date(); var dia=new Array(7); dia[0]="Sunday"; dia[1]="Monday"; dia[2]="Tuesday"; dia[3]="Wednesday"; dia[4]="Thursday"; dia[5]="Friday"; dia[6]="Saturday"; document.write("Today is: " + dia[d.getDay()]); var hoy = new Date(); document.write(" "+hoy.getDate()); var mm=new Date(); var m2 = mm.getMonth() + 1; var mes = (m2 < 10) ? '0' + m2 : m2; var mes = new Array(12); mes[0]="January"; mes[1]="February"; mes[2]="March"; mes[3]="April"; mes[4]="May"; mes[5]="June"; mes[6]="July"; mes[7]="August"; mes[8]="September"; mes[9]="October"; mes[10]="November"; mes[11]="December"; document.write(" of " + mes[mm.getMonth()]); var ano = new Date(); document.write(" of "+ano.getFullYear()); var hor=new Date(); var horita = new Date(); var hour=new Array(7); hour[0]="00"; hour[1]="01"; hour[2]="02"; hour[3]="03"; hour[4]="04"; hour[5]="05"; hour[6]="06"; hour[7]="07"; hour[8]="08"; hour[9]="09"; hour[10]="10"; hour[11]="11"; hour[12]="12"; hour[13]="01"; hour[14]="02"; hour[15]="03"; hour[16]="04"; hour[17]="05"; hour[18]="06";

hour[19]="07"; hour[20]="08"; hour[21]="09"; hour[22]="10"; hour[23]="11"; horita.getHours(); if(hor > 12) { document.write(" it is " + hour[hor.getDay()+2]+":"+hor.getMinutes()+":"+hor.getSeconds()+" P.M."); } else if(hor < 12) { document.write(" it is " + hour[hor.getDay()+2]+":"+hor.getMinutes()+":"+hor.getSeconds()+" A.M."); } }

else if(bienvenida == null | bienvenida == "") { var fecha = new Date(); document.write(fecha); } </script> </head> <body> </body> </html>

RESULTADOS
Opcin ES

Opcin EN

Opcin

Opcin Cancelar

También podría gustarte