ホームページ > 記事 > ウェブフロントエンド > JavaScriptの基本的な出力と埋め込みの書き方チュートリアル_基礎知識
JavaScript には印刷機能や出力機能がありません。
HTML では、HTML 要素を操作するために JavaScript がよく使用されます。
HTML 要素を操作する
JavaScript から HTML 要素にアクセスするには、document.getElementById(id) メソッドを使用できます。
HTML 要素を識別するには「id」属性を使用し、要素のコンテンツを取得または挿入するには innerHTML を使用してください:
例
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <p id="demo">我的第一个段落</p> <script> document.getElementById("demo").innerHTML = "段落已修改。"; </script> </body> </html>
上記の JavaScript ステートメント (3f1c4e4b6b16bbbd69b2ee476dc4f83a タグ内) は Web ブラウザーで実行できます:
HTML ドキュメントへの書き込み
テスト目的で、HTML ドキュメントに JavaScript を直接記述することができます:
例
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <p>我的第一个段落。</p> <script> document.write(Date()); </script> </body> </html>
コンテンツをドキュメントに書き込む場合のみ document.write() を使用してください。
ドキュメントの読み込みが完了した後に document.write が実行されると、HTML ページ全体が上書きされます。
例
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <p>我的第一个段落。</p> <button onclick="myFunction()">点我</button> <script> function myFunction() { document.write(Date()); } </script> </body> </html>
コンソールに書き込む
ブラウザがデバッグをサポートしている場合は、console.log() メソッドを使用してブラウザに JavaScript 値を表示できます。
ブラウザで F12 を使用してデバッグ モードを有効にし、デバッグ ウィンドウで [コンソール] メニューをクリックします。
例
<!DOCTYPE html> <html> <body> <h1>我的第一个 Web 页面</h1> <script> a = 5; b = 6; c = a + b; console.log(c); </script> </body> </html>