この章では、JavaScript の機能を示す例をいくつか紹介します。

JavaScript は HTML コンテンツを変更できます

getElementById() は、いくつかある JavaScript HTML メソッドの 1 つです。

この例では、このメソッドを使用して id="demo" の HTML 要素を「検索」し、要素の内容 (innerHTML) を "Hello JavaScript" に変更します:

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

試してみる

ヒント: JavaScript は二重引用符と単一引用符の両方を受け入れます:

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

試してみる

JavaScript は HTML 属性を変更できます

この例では、<img> タグの src 属性 (ソース) を変更して、HTML 画像を変更します:

電球

試してみる

JavaScript は HTML スタイル (CSS) を変更できます

HTML 要素のスタイルの変更は、HTML 属性の変更の変形です:

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

試してみる

JavaScript は HTML 要素を隠すことができます

HTML 要素は、display スタイルを変更することで非表示にできます:

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

試してみる

JavaScript は HTML 要素を表示できます

非表示の HTML 要素は、display スタイルを変更することで表示できます:

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

試してみる