PHELOX biedt u een uitgebreid en gratis JavaScript-trainingssysteem met operationele voorbeelden, van beginner tot professional.
Java-script kan HTML-inhoud wijzigen
Een van de vele JavaScript HTML-methoden is
getElementById()
.Het onderstaande voorbeeld "vindt" een HTML-element (met id="demo") en verandert de elementinhoud (innerHTML) in "Hallo JavaScript":
Voorbeeld 1:
document.getElementById("demo").innerHTML = "Hallo JavaScript";
JavaScript accepteert zowel dubbele als enkele aanhalingstekens:
Voorbeeld 2:
document.getElementById('demo').innerHTML = 'Hallo JavaScript';
JavaScript kan HTML-kenmerkwaarden wijzigen
In dit voorbeeld verandert JavaScript de waarde van het
src
(source) attribuut van een <img>
tag: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>