HTML ドキュメントに JavaScript を埋め込む 4 つの方法

この記事では主に、HTML ドキュメントにクライアント側の JavaScript コードを埋め込む 4 つの方法を紹介します。興味のある方は以下を参照してください:

HTML への JavaScript の埋め込み

HTML ドキュメントにクライアントを埋め込む方法は 4 つあります。サイド JavaScript コード:

1. インライン、<script> タグと </script> の間に配置されます。2. src 属性で指定された外部ファイル内に配置されます。 more);

3. onclick や onmouseover などの HTML イベント ハンドラーに配置されます (まれに)。この URL は特別なプロトコル「javascript」を使用します。プロトコル (まれに);

0 - 付属: スクリプト タイプ

JavaScript は、デフォルトでは、JavaScript コードを含むか、参照します。 VBScript などの非標準のスクリプト言語を使用する場合は、type 属性を使用してスクリプトの MIME タイプを指定する必要があります。例:

<script type="text/vbscript"> 
 ... ... 
</script>

type 属性のデフォルト値は「text/javascript」です。 」。

1 - インライン <script> 要素 </p><p><span style="color: #ff0000"> 例: </span><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"> &lt;script&gt; function displayTime(){ ... ... } window.onload = displayTime; &lt;/script&gt;</pre><div class="contentsignin">ログイン後にコピー</div></div></p><p>2 - src 属性は src 属性をサポートしており、この属性は URL を指定しますJavaScript コード ファイルの。その使用法は次のとおりです: <span style="color: #0000ff"></span></p>コードをコピーします<p> コードは次のとおりです: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false">&lt;script src=&quot;../../scripts/util.js&quot;&gt;&lt;/script&gt;</pre><div class="contentsignin">ログイン後にコピー</div></div><p> src 属性を使用する場合、<script></script> タグの間にあるものは無視されます。 src 属性を使用してページにスクリプトを含めると、スクリプトに Web ページに対する完全な制御を与えることになります。

3 - HTML のイベント ハンドラー

スクリプトが配置されている HTML ファイルがブラウザーに読み込まれると、このスクリプト内の JavaScript コードは 1 回だけ実行されます。 JavaScript コードは、Element オブジェクトのプロパティに関数を割り当てることで、イベント ハンドラーを登録できます。この Element オブジェクトは、ドキュメント内の HTML 要素を表します。

例:

コードをコピーします

コードは次のとおりです:

<input type="checkbox" name="options" value="giftwrap" onchange="order.options.giftwrap = this.checked;">

HTML で定義されたイベント ハンドラーの属性には、カンマで区切られた任意の JavaScript ステートメントを含めることができます。これらのステートメントは関数の本体を形成し、これが対応するイベント ハンドラー プロパティの値になります。

4 - URL 内の JavaScript

URL の後に javascript:protocol 修飾子を付けることは、JavaScript コードをクライアントに埋め込むもう 1 つの方法です。この特殊なプロトコル タイプは、URL コンテンツが任意の文字列、つまり JavaScript インタープリタによって実行される JavaScript コードであることを指定します。これは別のコード行として扱われます。つまり、ステートメントはセミコロンで区切られ、コメントは /**/ コメントに置き換えられる必要があります。 javascript:URLで識別できるリソースは、実行したコードを文字列に変換した戻り値です。コードが未定義を返す場合、リソースにはコンテンツがありません。

javascript: URL は、 タグの href 属性、

の action 属性、または window.open() のパラメータなど、通常の URL を使用できる場所であればどこでも使用できます。方法。

ハイパーリンク内の JavaScript URL は次のようになります:

<a href="javascript:new Date().toLocaleTimeString();" rel="external nofollow" > 
What time is it? 
</a>

以上がHTML ドキュメントに JavaScript を埋め込む 4 つの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。