JavaScript y HTML
Etiquetas:
curso,
diseño web
Usted puede pensar en JavaScript como una extensión de HTML; un add-on, si se quiere.He aquí cómo funciona. Etiquetas HTML crean objetos; JavaScript permite manipular esos objetos. Por ejemplo, se utiliza la etiqueta <BODY> y </ body> para crear una página Web o un documento.
Como se muestra en la Tabla 1, después de crear ese documento, se puede interactuar con él mediante el uso de JavaScript.
Por ejemplo, puede utilizar un JavaScript especial constructo llamado el controlador de eventos onLoad para desencadenar una acción - jugar una melodía de bienvenida, tal vez - cuando el documento se carga en un navegador Web.
Ejemplos de otros objetos HTML que usted interactúa con el uso de JavaScript incluyen ventanas, campos de texto, imágenes y applets Java embebidos.
Tabla 1: Crear y trabajar con objetos
| Objecto | HTML Tag (etiqueta) | JavaScript |
| Pagina web | <BODY> . . . </BODY> | document |
| Imagenes | <IMG NAME="myImage"> | document.myImage |
| Formualrio HTML | <FORM name="myForm"> . . . </FORM> | document.myForm |
| Butones | <INPUT TYPE="button" NAME="myButton"> | document.myForm.myButton |
Para añadir JavaScript a una página Web, todo lo que tienes que hacer es incrustar código JavaScript en un archivo HTML. Debajo de la línea en la que se incrusta el código JavaScript, puede hacer referencia, o llame, ese código JavaScript en respuesta a un controlador de eventos o un enlace HTML.
Usted tiene dos opciones cuando se trata de incrustar código JavaScript en un archivo HTML:
Usted puede utilizar el <script> y </ script> etiquetas para incluir código JavaScript directamente en un archivo HTML.
En el ejemplo siguiente, una función de JavaScript llamada ProcessOrder () se define en la parte superior del archivo HTML.
Más abajo en el archivo HTML, la función JavaScript está asociado con un controlador de eventos - específicamente, controlador de eventos onClick del botón ProcessOrder.
(En otras palabras, el código JavaScript contenido en los ProcessOrder () se ejecuta la función cuando un usuario hace clic en el botón ProcessOrder.)
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
// JavaScript statements go here
function processOrder() {
// More JavaScript statements go here
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myForm">
<INPUT TYPE="button" NAME="processOrder" VALUE="Click to process your order" onClick="processOrder();">
...
</HTML>
Usted puede utilizar el <script> y </ script> etiquetas para incluir un archivo separado, externo JavaScript (un archivo que contiene sólo de JavaScript declaraciones y teniendo una extensión .js) en un archivo HTML.
En el siguiente ejemplo, la función JavaScript ProcessOrder () se define en el archivo myJSfile.js. La función se activa, o llama, cuando el usuario hace clic en el Click Aquí para procesar su enlace Orden.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript" SRC="myJSfile.js">
</SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:processOrder();">Click here to process your order.</A>
...
</BODY>
</HTML>
Debido a que las páginas web no están hechas de HTML solo, JavaScript proporciona acceso a más que simples objetos HTML. JavaScript también permite el acceso a objetos en navegador y específicas de la plataforma. Navegador de plug-ins (como RealPlayer y Adobe Acrobat), el nombre y la versión del navegador de un espectador en particular, y la fecha actual, son ejemplos de objetos que no sean HTML que se puede trabajar con mediante el uso de JavaScript.
Juntos, todos los objetos que componen un sitio Web - objetos HTML, en navegador y los objetos relacionados con plataformas, y objetos especiales integradas en el lenguaje JavaScript - se conocen como el modelo de objeto de documento (DOM).
Entradas
