Después, se enseñaron lo que eran los eventos en javascript y algunos de ellos, como por ejemplo:
-> onclick: al oprimir y soltar el ratón.
-> ondblclick: oprimir el ratón dos veces seguidas.
-> onfocus: es cuando el puntero está activo en algún objeto, tiene el foco en algún objeto.
-> onblur: es cuando un objeto pierde el foco, es decir, es quien tuvo antes el foco.
-> onkeypress: al oprimir una tecla.
-> onkeyup: soltar una tecla pulsada.
-> onkeydown: pulsar una tecla (sin soltar).
-> onload: es cuando una página se ha cargado completamente, por ejemplo, lo que pasa al oprimir F5.
Así como esos eventos, hay otros más, ver esta url:
http://librosweb.es/libro/javascript/capitulo_6/modelo_basico_de_eventos_2.html
Después, seguimos con las funciones, y se realizó el siguiente ejercicio:
<script>
function s(){
var a = parseInt(document.getElementById("a").value);
var b = parseInt(document.getElementById("b").value);
//alert ( a + b);
//document.write( a + b);
var rta = a + b;
document.getElementById("rta").value = rta;
document.getElementById("holita").innerHTML = "<marquee><b><font color='#ff0000'>" + "Esto es el resultado de mi suma = " + (a + b ) + "</font></b></marquee>";
}
function r(){
var a = parseInt(document.getElementById("a").value);
var b = parseInt(document.getElementById("b").value);
//alert ( a + b);
//document.write( a + b);
document.getElementById("rta").value = a - b;
document.getElementById("holita").innerHTML = "<marquee><b><font color='#ff0000'>" + "Esto es el resultado de mi resta = " + (a - b ) + "</font></b></marquee>";
}
function m(){
var a = parseInt(document.getElementById("a").value);
var b = parseInt(document.getElementById("b").value);
document.getElementById("rta").value= a * b;
document.getElementById("holita").innerHTML = "<marquee><b><font color='#ff0000'>" + "Esto es el resultado de mi multiplicacion = " + (a*b) + "</font></b></marquee>";
}
</script>
<body>
<label>A:</label> <input type="text" id="a" autocomplete="off"><br>
B: <input type="text" id="b"><br>
Rta: <input type="text" id="rta" readonly ><hr>
<input type="button" value="Sumar" onclick="s();" >
<input type="button" value="Restar" onclick="r();">
<input type="button" value="Multiplicar" onclick="m();">
<hr>
<div id="holita">esto es mi mensaje</div>
<hr>
</body>
En este ejercicio, se utilizó document.getElementById, para que este funcione, se necesita asignar una ID en algún elemento del código, después, lo que hará es tomar la id y así se podrá manipular, por ejemplo, se puede cambiar y asignar un nuevo valor para el elemento.
Publicar un comentario