INNERHTML , EVENTOS JAVASCRIPT ONCLICK ETC...
FEBRERO / 15 / 2017
Al principio de clase en un espacio de 10 minutos no inscribimos en curso de ingles sen a, y seguimos clase normal viendo innerhtml , funciones , envetos de javascript en lo s cuales se veran ejemplos acontinuacion
-> 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 totalmente
Ejemplo innerhtml:
https://developer.mozilla.org/es/docs/Web/API/Element/innerHTMLhttp://librosweb.es/libro/javascript/capitulo_6/modelo_basico_de_eventos_2.html
Con las dudas de clase se realizo 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>
Al principio de clase en un espacio de 10 minutos no inscribimos en curso de ingles sen a, y seguimos clase normal viendo innerhtml , funciones , envetos de javascript en lo s cuales se veran ejemplos acontinuacion
-> 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 totalmente
Ejemplo innerhtml:
<html>
<head></head>
<body>
<div id="txt">
<script id="txt0"> x=0 </script>
<noembed id="txt1"> 1 </noembed>
<noframes id="txt2"> 2 </noframes>
<noscript id="txt3"> 3 </noscript>
<div id="txt4"> 4 </div>
<div>
<noscript id="txt5"> 5 </noscript>
</div>
<span id="txt6"> 6 </span>
</div>
<div id="innerHTMLtxt"></div>
<div id="textContenttxt"><div>
<script>
for (i=0;i<7;i++){
x="txt"+i;
document.getElementById(x).firstChild.nodeValue='&<>'
}
document.getElementById("innerHTMLtxt").textContent=document.getElementById("txt").innerHTML
document.getElementById("textContenttxt").textContent=document.getElementById("txt").textContent
</script>
<body>
</html>Con las dudas de clase se realizo 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>
0 comentarios: