ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptとHTML_javascriptスキルの組み合わせの詳細な説明
JavaScriptとHTML_javascriptスキルの組み合わせの詳細な説明
- WBOYオリジナル
- 2016-05-16 15:30:291406ブラウズ
HTML 内の JavaScript スクリプトは、HTML ページの 6c04bd5ca3fcae76e30b72ad730ca86d タグと 93f0f5c25f18dab9d176bd4f6de5d30e タグの間に配置する必要があります。状況に応じて異なりますが、通常は 93f0f5c25f18dab9d176bd4f6de5d30e タグ内に配置されます。
1.
タグ
HTML ページに JavaScript スクリプトを挿入する必要がある場合は、& lt; スクリプト & gt; を使用します。 3f1c4e4b6b16bbbd69b2ee476dc4f83a と 2cacc6d41bbb37262a98f745aa00fbf0 は JavaScript にどこから開始するかを指示します
そして終了。
<span style="font-size:18px;"><script type="text/javascript">
alert("欢迎来到JavaScript世界！！！");
</script></span>
古いインスタンスでは、3f1c4e4b6b16bbbd69b2ee476dc4f83a タグで type="text/javascript" を使用する場合があります。これはもう必要ありません。 JavaScript はすべての最新ブラウザに存在します
HTML5 のデフォルトのスクリプト言語。 JavaScript 言語を学習したばかりの方でも、すぐに使えます。
2.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
>
</head>
<body>
<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>
<script type="text/javascript">
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
</body>
</html>
JavaScript コードの作成方法と実行方法にはこだわらず、まず結果を見てみましょう:
上の例の JavaScript ステートメントは、ページが読み込まれるときに実行されます。通常、ユーザー などのイベントが発生したときにコードを実行する必要があります。
ボタンをクリックしたとき。 JavaScript コードを関数内に配置すると、イベントが発生したときにその関数を呼び出すことができます。
内の JavaScript
HTML ドキュメントには無制限の数のスクリプトを含めることができます。スクリプトは HTML の
5.
の JavaScript 関数
この例では、JavaScript 関数を HTML ページの 93f0f5c25f18dab9d176bd4f6de5d30e セクションに配置します。ボタンをクリックするとこの関数が呼び出されます:
コード例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
<script type="text/javascript">
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>
ボタンをクリックした後の効果は次のとおりです: 
6.
の JavaScript 関数
この例では、HTML ページの 6c04bd5ca3fcae76e30b72ad730ca86d セクションに JavaScript 関数を配置します。ボタンをクリックするとこの関数が呼び出されます:
コード例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">点击这里</button>
<script type="text/javascript">
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</body>
</html>
ヒント:
e388a4556c0f65e1904146cc1a846bee 要素の作成後にスクリプトが確実に実行されるように、JavaScript をページ コードの最後に配置します。
7. 外部JavaScript
スクリプトを外部ファイルに保存することもできます。外部ファイルには、複数の Web ページで使用されるコードが含まれることがよくあります。外部 JavaScript ファイルのファイル拡張子
展示名は.jsです。外部ファイルを使用する必要がある場合は、3f1c4e4b6b16bbbd69b2ee476dc4f83a タグの「src」属性に .js ファイルを設定してください。
私たちは外部 JavaScript メソッドの使用を推奨しており、通常は HTML ドキュメントに接続するために別のメソッドも使用します。
例
HTMLコード:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>JavaScript脚本语言</title> <script type="text/javascript" src="/js/myScript.js"></script> </head> <body> <h1>My Web Page</h1> <p id="demo">A Paragraph.</p> <button type="button" onclick="myFunction()">点击这里</button> <p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p> </body> </html>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
実行結果は上記と一致しています。
実際の実行結果は、3f1c4e4b6b16bbbd69b2ee476dc4f83a タグ内にスクリプトを記述した場合とまったく同じです。
外部スクリプトには 3f1c4e4b6b16bbbd69b2ee476dc4f83a タグを含めることはできません。
以上はJavaScriptとHTMLを組み合わせる方法ですので、皆様の学習のお役に立てれば幸いです。