JavaScriptの使用法

JavaScript の使用法

HTML 内のスクリプトは、<script> タグと </script> の間に配置する必要があります。

スクリプトは HTML ページの <body> セクションと <head> に配置できます。

<script> タグ

HTML ページに JavaScript を挿入するには、<script> タグを使用します。

<script> と </script> は JavaScript に開始位置と終了位置を指示します。

<script> と </script> の間の行には JavaScript が含まれています:

<script>
alert("我的第一个 JavaScript");
</script>

上記のコードを理解する必要はありません。ブラウザは <script> ="text/javascript" の間の JavaScript コードを解釈して実行することを理解してください。これはもう必要ありません。 JavaScript は、HTML5 だけでなく、最新のすべてのブラウザーでもデフォルトのスクリプト言語です。

<body>


の JavaScript この例では、ページの読み込み時に JavaScript が HTML の <body> にテキストを書き込みます。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>    
<p>
JavaScript 能够直接写入 HTML 输出流中:
</p>
<script>
document.write("<h1>This is a title</h1>");
document.write("<p>This is a paragraph</p>");
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。
</p>  
</body>
</html>


JavaScript の関数とイベント

ページのロード時に実行されます。

通常、ユーザーがボタンをクリックしたときなど、イベントが発生したときにコードを実行する必要があります。

JavaScript コードを関数に入れると、イベントの発生時にその関数を呼び出すことができます。 JavaScript の関数とイベントについては後の章で詳しく学びます。 <head> または <body> 内の JavaScript

HTML ドキュメントには無制限の数のスクリプトを含めることができます。

スクリプトは HTML の <body> セクションまたは <head> セクションに含めることができます。

通常のアプローチは、関数を <head> セクションまたはページの下部に配置することです。こうすることで、ページのコンテンツを妨げずに同じ場所に配置できます。

<head>

の JavaScript 関数 この例では、HTML ページの <head> セクションに JavaScript 関数を配置します。

この関数は、ボタンがクリックされると呼び出されます:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<script>
function myFunction(){
document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>

<body> の JavaScript 関数

この例では、HTML ページの <body> に JavaScript 関数を配置します。 。 一部。

ボタンをクリックするとこの関数が呼び出されます:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
<h1>My first web</h1>
<p id="demo">This is a paragraph</p>
<button type="button" onclick="myFunction()">点击这里</button>
<script>
function myFunction(){
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
    
</body>
</html>

外部JavaScript

スクリプトを外部ファイルに保存することもできます。外部ファイルには、複数の Web ページで使用されるコードが含まれることがよくあります。

外部 JavaScript ファイルのファイル拡張子は .js です。

外部ファイルを使用する必要がある場合は、<script> タグの「src」属性に .js ファイルを設定してください:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<p><b>注释:</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
<script src="myScript.js"></script>
</body>
</html>


学び続ける
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <p> JavaScript 能够直接写入 HTML 输出流中: </p> <script> document.write("<h1>This is a title</h1>"); document.write("<p>This is a paragraph</p>"); </script> <p> 您只能在 HTML 输出流中使用 <strong>document.write</strong>。 如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。 </p> </body> </html>