Javascript no obtrusivo (II)

Hoy en día se está poniendo muy de moda en el mundo de desarrollo web este término, tal y como comentabamos hace unos dias en la entrada Javascript no obstrusivo.

Parece que se está confundiendo Javascript no obstrusivo con el uso de Frameworks de Javascript, como por ejemplo JQuery y Prototype. Y no hay inconveniente ninguno en hacer un código HTML o XHTML sin programar eventos Javascript en dicho código y no usar algún Framework de Javascript.

Es tan sencillo como este código:


document.getElementById("div_click").onclick = function(){
   HolaMundo();
};

Viene a decir: “Cuando se haga click en el elemento que tenga por ID “div_click” se ejecutará la función HolaMundo.”

Aquí tenéis el código completo del ejemplo:

ejemplo.html:


<html>

   <body>
<div id="div_click">Click aquí</div>
<script type="text/javascript" src="ejemplo.js"></script>

   </body>
</html>

ejemplo.js:


//funciones

function HolaMundo(){
   alert("HolaMundo");
}

//lanzadores de eventos
document.getElementById("div_click").onclick = function(){
   HolaMundo();
};

Quien dice “.onclick” puede decir “.onfocus”, “.ondblclick”, o cualquier otro evento.

Si lo que queremos es programar el evento onload del body, haremos esto:


window.onload = function(){

   HolaMundo();

}

Anuncios

Etiquetado:

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: