ホームページ > 記事 > ウェブフロントエンド > 【JavaScriptチュートリアル】JavaScript出力
【JavaScriptチュートリアル】JavaScript出力
- 黄舟オリジナル
- 2016-12-24 14:26:15909ブラウズ
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 ブラウザー:
document.getElementById("demo") は、id 属性を使用して HTML 要素を検索する JavaScript コードです。
innerHTML = "段落が変更されました。" は、要素の HTML コンテンツ (innerHTML) を変更するために使用される JavaScript コードです。
このチュートリアルでは
ほとんどの場合、このチュートリアルでは、上記の方法を使用して出力します。
次の例では、id="demo" を持つ e388a4556c0f65e1904146cc1a846bee 要素を HTML In ドキュメント出力に直接書き込みます。
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>
ご存知ですか?
プログラムのデバッグは、バグ (エラー) をテストし、発見し、減らすプロセスです。
上記は、[JavaScript チュートリアル] の JavaScript によって出力されたコンテンツです。さらに関連するコンテンツについては、PHP 中国語 Web サイト (www.php.cn) に注目してください。