MiBlogInformatico

Just another WordPress.com weblog

¿CÓMO TRABAJAR CON HTML Y JAVASCRIPT?

Posted by mibloginformatico en junio 19, 2008

Existen dos formas de integrar código javascript a nuestra página html. La primera forma es ingresando las funciones del javascript en el mismo documento que escribimos el html, dentro de las etiquetas

<script language=”javascript” src=”nombreDelJavascript.js”> </script> <!-dentro del head del html —>

, y la segunda es creándonos un archivo aparte que contenga todo el código javascript, este debería guardarse con una extensión .js, y luego se lo debe llamar desde el código html, con la siguiente línea:

<script language=”javascript” src=”nombreDelJavascript.js”> </script> <!-dentro del head del html –>

Con esto quedará enlazada nuestra página a las funciones del javascript, y trabajará sin ningún problema.

Se lo puede trabajar de cualquiera de las dos formas, pero la recomendable es esta última (en otro archivo), ya que se hace mucho más fácil la lectura y en caso de modificación la tarea también se hace más sencilla y no se tiende mucho a confusiones.
Por otro lado si escribimos el html y javascript dentro de un mismo archivo, se hace complicada su lectura y no es buena idea que el diseño y las funciones se encuentren juntas, es lo que se le llama ensuciar el código y si queremos hacer alguna modificación se nos hará más complejo.
Para llamar alguna función del script lo podemos hacer desde cualquier elemento utilizando algún evento por ejemplo:

<input type=”button” value=”miBoton”/> <!-me crea un cuadro de texto –>

Dentro de este cuadro de texto podemos hacer la llamada a alguna función, utilizando algún evento

<input type=”button” value=”miBoton” onclick=”hacerAlgo()”/> <!-en el momento de hacer clic sobre este botón se ejecutará la función hacerAlgo –>

Es esta una muy buena manera para trabajar con las funciones de javascript pero existe otra forma, que se trata de ejecutar todas las funciones en el momento que se carga la página, para esto utilizamos el evento onload, con la manera recomendada para relacionar la página html con código javascript que es trabajándolos en archivos separados, se lo haría de la siguiente manera:

window.onload=función1; /*se ejecutará al cargarse la página, va dentro del archivo js*/

Pero esto solamente llama a una función (funcion1), por lo que si queremos realizar varias acciones, deberíamos declarar una función que contenga a todas las demás, y luego si ejecutar a esta función contenedora
function todasLasFunciones(){ //esta es una función que llama a todas las que deben ejecutarse
..obtener función1
..obtener función2
..obtener función3
}
Y luego de esto si con esta línea en el archivo js
window. onload=todasLasFunciones; //obtengo todas las funciones llamadas desde esta funcion
puedo obtener todas las funciones juntas que se ejecutarán al cargarse la página, o al producirse el evento señalado en cada una de la obtención de las funciones. Por ejemplo para que se ejecute la función1 puedo utilizar el evento onclick y para la función2 el evento keypress.

Existen algunas maneras para obtener las funciones, como se indicó antes directamente desde la etiqueta donde se encuentra el objeto, pero en el caso de hacerlo desde el archivo js, se puede hacer la llamada al objeto mediante algunas formas, puede ser mediante:

Document.getElementsByTagName //mediante el nombre de la etiqueta
Document.getElementById //es necesario asignarle un id al objeto para luego hacer referencia este
Document.getElementByName // es necesario asignarle un nomre al objeto para luego hacer referencia este
Existen también algunas otras maneras, pero para más claridad, aquí escribo un ejemplo con la utilización del id.

<input type=”button” id=”miBoton”/ > <!-esto va dentro del archivo html –>

function todasLasFunciones(){
document.getElementById(“miBoton”).onclick=funcion1; //me hace referencia al botón con id miBotón

}
Entonces me indica que al momento que se produzca el evento de realizar un clic sobre el botón referenciado se me va a ejecutar la funcion1.

mipaginainformatica.es.tl

Anuncios

Una respuesta to “¿CÓMO TRABAJAR CON HTML Y JAVASCRIPT?”

  1. Hi, this is a comment.
    To delete a comment, just log in, and view the posts’ comments, there you will have the option to edit or delete them.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

 
A %d blogueros les gusta esto: