Introducción a JavaScript


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>


Introducción a JavaScript