PHELOX provides you with a comprehensive and free JavaScript training system with operational examples, from beginner to professional.
Java Script puede cambiar el contenido HTML
Uno de los muchos métodos HTML de JavaScript es
getElementById()
.El siguiente ejemplo "busca" un elemento HTML (con id="demo") y cambia el contenido del elemento (innerHTML) a "Hello JavaScript":
Ejemplo 1:
document.getElementById("demo").innerHTML = "Hola JavaScript";
JavaScript acepta comillas simples y dobles:
Ejemplo 2:
document.getElementById('demo').innerHTML = 'Hola JavaScript';
JavaScript puede cambiar los valores de los atributos HTML
En este ejemplo, JavaScript cambia el valor del atributo
src
(fuente) de una etiqueta <img>
:Download Codes:
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div style="width:100%;text-align:center">
<img id="_lightblb" src="https://cdn.phelox.com/assets/uploads/pic_bulboff.gif"><br><br>
<input onclick="document.getElementById('_lightblb').src='https://cdn.phelox.com/assets/uploads/pic_bulbon.gif';" type="button" value="Turn on the light">
<input onclick="document.getElementById('_lightblb').src='https://cdn.phelox.com/assets/uploads/pic_bulboff.gif';" type="button" value="Turn off th light">
</div>
</body>
</html>