JavaScriptのHTML DOMは、HTMLコンテンツを変更します
HTML DOMは、JavaScriptがHTML要素の内容を変更することができます。
HTML出力ストリームを変更
JavaScriptは、動的HTMLコンテンツを作成することができます。
今日の日付は、次のとおりです。
JavaScriptでは、のdocument.write（）がそのまま出力ストリームにHTMLコンテンツを記述するために使用することができます。
 | ドキュメントの読み込みが完了した後にdocument.writeを使用しないでください（）。 これは、文書を上書きします。 |
|---|
HTMLコンテンツを変更します
innerHTMLプロパティにHTMLコンテンツを変更する最も簡単な方法を使用。
HTML要素の内容を変更するには、次の構文を使用します。
document.getElementById(id).innerHTML=新的 HTML
この例では、<p>要素の内容を変更します。
例
<HTML>
<ボディ>
<PのID = "P1"> Hello Worldの！</ P>
<スクリプト>
document.getElementById（ "P1"）innerHTMLの= "新しいテキスト！";
</スクリプト>
</ BODY>
</ HTML>
<ボディ>
<PのID = "P1"> Hello Worldの！</ P>
<スクリプト>
document.getElementById（ "P1"）innerHTMLの= "新しいテキスト！";
</スクリプト>
</ BODY>
</ HTML>
»をお試しください
この例では、<H1>要素の内容を変更します。
例
<!DOCTYPE html>
<html>
<body>
<h1 id="header">Old Header</h1>
<script>
var element=document.getElementById("header");
element.innerHTML="新标题";
</script>
</body>
</html>
<html>
<body>
<h1 id="header">Old Header</h1>
<script>
var element=document.getElementById("header");
element.innerHTML="新标题";
</script>
</body>
</html>
»をお試しください
説明する例：
- <H1>要素のid = "ヘッダー"が含まれている上記のHTMLドキュメント
- 私たちは、ID = "header"の要素を取得するためにHTML DOMを使用します
- この要素の内容にはJavaScript変更（innerHTMLプロパティ）
HTML属性を変更します
HTML要素のプロパティを変更するには、次の構文を使用します。
document.getElementById(id).attribute=新属性值
この例では、src属性の<img>要素を変更します。
例
<!DOCTYPE html>
<html>
<body>
<img id="image" src="smiley.gif">
<script>
document.getElementById("image").src="landscape.jpg";
</script>
</body>
</html>
<html>
<body>
<img id="image" src="smiley.gif">
<script>
document.getElementById("image").src="landscape.jpg";
</script>
</body>
</html>
»をお試しください
説明する例：
- <IMG>要素のid = "画像"が含まれている上記のHTMLドキュメント
- 私たちは、ID = "画像"要素を取得するためにHTML DOMを使用します
- JavaScriptは（「landscape.jpg "に" smiley.gif "）この要素のプロパティを変更します