Javascript

¿Qué es Javascript? • Fue diseñado para agregar interactividad a páginas HTML • Es un lenguaje de scripting (un lenguaje de secuencias de comandos es un lenguaje de programación ligero) • Código JavaScript está normalmente incrustada directamente en Páginas HTML • JavaScript es un lenguaje interpretado (significa que secuencias de comandos de ejecutan sin compilación preliminar)

¿Qué puede hacer un JavaScript? • JavaScript puede poner texto dinámico en una página HTML • JavaScript puede reaccionar a eventos • JavaScript puede leer y escribir elementos HTML • JavaScript puede utilizarse para validar los datos de entrada • JavaScript puede utilizarse para crear cookies

Cómo poner un código JavaScript en una página HTML Con la etiqueta <SCRIPT></SCRIPT> (también utilizar el atributo type para definir el lenguaje de scripting) <html> <head> <script type="text/javascript"> ... </script> </head> <body> <script type="text/javascript"> ... </script> </body> </html>

Dónde se coloca el código JavaScript Se puede colocar tanto en el interior de la etiqueta <head></head> como en el <body></body> Lo conveniente es colocarlo en <head></head> <html> <head> <script type="text/javascript"> .... </script> </head>

Dónde se colocan las secuencias de comandos - Pueden estar tanto en <head></head> como en <body></body> - Lo conveniente es colocarlo en <head></head> <html> <head> <script type="text/javascript"> .... </script> </head>

Archivos JavaScript externos - Los Scripts pueden suministrarse de forma local o remota mediante archivos de JavaScript accesible mediante el atributo src <html> <head> <script language="JavaScript" type="text/javascript" src="http://somesite/myOwnJavaScript.js" > </script> <script language="JavaScript" type="text/javascript" src="myOwnSubdirectory/myOwn2ndJavaScript.js" > </script>

Variables Puedes crear una variable con o sin la declaración var. var strname = some value strname = some value Cuando se declara una variable dentro de una función, sólo se puede acceder a esta dentro de esa función. Si se declara una variable fuera de una función, todas las funciones de la página pueden acceder a ella. La duración de estas variables se inicia cuando son declaradas y termina cuando se cierra la página

Cuadros - Cuadro de alerta. El usuario tendrá que hacer clic en "Aceptar" para continuar. - Cuadro de confirmación. El usuario tendrá que hacer clic en "Aceptar" o "Cancelar" para continuar. - Cuadro Prompt. El usuario tendrá que hacer clic en "OK" o "Cancelar" para proceder después de introducir un valor de entrada

Funciones Una función de JavaScript contiene un código que será ejecuta sólo por un evento o por una llamada a función. Usted puede llamar a una función desde cualquier lugar dentro de la página (o incluso desde otras páginas si la función es incrustada en un archivo .js externo).

Ejemplo de función <html> <head> <script type="text/javascript"> // If alert("Hello world!!") below had not been written within a // function, it would have been executed as soon as the page gets loaded. function displaymessage() { alert("Hello World!") } </script> </head> <body> <form> <input type="button" value="Click me!" onclick="displaymessage()" > </form> </body>

Controladores de eventos & eventos Cada elemento en una página web tiene ciertos eventos que pueden desencadenar la invocación de los controladores de eventos. Los atributos se insertan en las etiquetas HTML para definir eventos y controladores de eventos. Ejemplos de eventos: - Un clic del ratón. - Una página web o una carga de imágenes - Pasar sobre un punto en la página web - Selección de un cuadro de entrada en un formulario HTML - Enviar un formulario HTML - Una pulsación de tecla

Eventos - onabort Se interrumpe la carga de una imagen - onblur Un elemento pierde el foco - onchange El contenido de un campo cambia - onclick El ratón hace clic en un objeto - ondbclick El ratón hace doble clic en un objeto - onerror Se produce un error al cargar un documento o una imagen - onfocus Un elemento obtiene el foco - onkeydown Se presiona una tecla del teclado - onkeypress Se presiona o es presionada una tecla del teclado - onkeyup Se suelta una tecla del teclado - onload Finaliza la carga de una página o una imagen - onmousedown Se presiona un botón del ratón - onmousemove El ratón se mueve - onmouseout El ratón se mueve fuera de un elemento - onmouseover El ratón se mueve sobre un elemento - onmouseup Se suelta un botón del ratón - onreset Se hace clic en el botón de restablecimiento - onresize Se cambia el tamaño de una ventana o un marco - onselect Texto seleccionado - onsubmit Se hace clic en el botón enviar - onunload El usuario sale de la página

Eventos onload & onUnload Se desencadenan los eventos onload y onUnload cuando el usuario entra o sale de la página. El evento onload se utiliza a menudo para comprobar el visitantectipo de navegador y la versión del navegador y la carga del la versión adecuada de la página web basada en la información. Los eventos onload onUnload también son a menudo utilizados para hacer frente a las cookies que se deben establecer cuándo un usuario entra o sale de una página.

onFocus, onBlur y onChange Los eventos onFocus, onBlur y onChange a menudo se usan en combinación con validación de campos de formulario. Ejemplo: Se llamará la función de checkEmail() Cuando el usuario cambia el contenido del campo: <input type="text" size="30" id="email" onchange=" checkEmail() ">;

onSubmit El evento onSubmit se utiliza para validar todos los campos de un formulario antes de enviarlo. Ejemplo: Se llamará la función de checkForm() Cuando el usuario hace clic en el botón "Enviar" en el formulario. Si no se aceptan los valores del campo, el envío se ha cancelado. Devuelve la función checkForm() true o false. Si devuelve true el formulario estará presentado, de lo contrario el envío será cancelado: <form method="post" action="xxx.html" onsubmit="return checkForm() ">

Objetos de JavaScript JavaScript es un idioma orientado a objetos. Un objeto de JavaScript tiene propiedades y métodos. Ejemplo: Objeto String de JavaScript tiene la propiedad de longitud y método toUpperCase() <script type="text/javascript"> var txt="Hello World!" document.write(txt. length ) document.write(txt. toUpperCase() ) </script>

HTML DOM El DOM HTML define un conjunto estándar de objetos para HTML y una forma estándar para tener acceso y manipular documentos HTML Todos los elementos HTML, junto con su texto que contengan y atributos, puede accederse a través del DOM. El contenido puede ser modificado o eliminado y pueden crearse N uevos elementos. El DOM de HTML es la plataforma y lenguaje independiente. Se puede utilizar cualquier lenguaje de programación como Java, JavaScript y VBScript

Javascript

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (15)

En vedette

En vedette (20)

Similaire à Javascript

Similaire à Javascript (20)

Javascript