JavaScript 簡介

本章向您提供了展示 JavaScript 能力的部分實例。

JavaScript 能夠改變 HTML 內容

getElementById() 是多個 JavaScript HTML 方法之一。

本例使用該方法來“查找” id="demo" 的 HTML 元素,并把元素內容(innerHTML)更改為 "Hello JavaScript":

實例

document.getElementById("demo").innerHTML = "Hello JavaScript";

親自試一試

提示:JavaScript 同時接受雙引號和單引號:

實例

document.getElementById("demo").innerHTML = 'Hello JavaScript';

親自試一試

JavaScript 能夠改變 HTML 屬性

本例通過改變 <img> 標簽的 src 屬性(source)來改變一張 HTML 圖像:

燈泡


親自試一試

JavaScript 能夠改變 HTML 樣式 (CSS)

改變 HTML 元素的樣式,是改變 HTML 屬性的一種變種:

實例

document.getElementById("demo").style.fontSize = "25px";

親自試一試

JavaScript 能夠隱藏 HTML 元素

可通過改變 display 樣式來隱藏 HTML 元素:

實例

document.getElementById("demo").style.display="none";

親自試一試

JavaScript 能夠顯示 HTML 元素

可通過改變 display 樣式來顯示隱藏的 HTML 元素:

實例

document.getElementById("demo").style.display="block";

親自試一試

課外閱讀

JavaScript 高級教程: JavaScript 歷史JavaScript 實現