PHELOX 為您提供全面、免費的 JavaScript 培訓系統,附帶操作示例,從初學者到專業人士。
Java 腳本可以改變 HTML 內容
許多 JavaScript HTML 方法之一是
getElementById()
。下面的示例“找到”一個 HTML 元素(id="demo"),並將元素內容 (innerHTML) 更改為“Hello JavaScript”:
示例 1:
document.getElementById("demo").innerHTML = "Hello JavaScript";
JavaScript 接受雙引號和單引號:
示例 2:
document.getElementById('demo').innerHTML = 'Hello JavaScript';
JavaScript 可以更改 HTML 屬性值
在此示例中,JavaScript 更改了
<img>
標記的 src
(源)屬性的值: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>