ホームページ >ウェブフロントエンド >フロントエンドQ&A >HTML内でJavaScriptをリンクする方法
HTML内でJavaScriptをリンクする方法
- WBOYオリジナル
- 2023-05-09 15:33:073459ブラウズ
Web 開発では、JavaScript は Web サイトのフォーム検証、アニメーション効果、対話性などに広く使用されています。 Javascriptを有効にするには、HTML内でJSファイルをリンクする必要があります。この記事ではHTML内でJavaScriptをリンクする方法を解説します。
1. JavaScript の埋め込み
最も基本的な方法は、HTML ドキュメント内のファイルにリンクせずに、JavaScript コードを HTML ページに直接埋め込むことです。以下に示すように:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>嵌入Javascript</title>
</head>
<body>
<script>
//在这里写Javascript代码
</script>
</body>
</html>JavaScript コードを埋め込む方法は、非常に単純な機能要件に適しており、プラットフォーム間で最も速い方法です。
2. 外部リンク Javascript ファイル
JavaScript コードの量が徐々に増加すると、コードを別の .js ファイルに記述し、その .js ファイルを HTML 内でリンクする必要があります。 Javascript プログラム全体をロードします。新しい .js ファイルを作成し、そのファイルに Javascript コードをコピーして貼り付け、そのファイルを HTML ページにリンクします。以下に示すように:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>外链Javascript</title>
</head>
<body>
<script src="helloworld.js"></script>
</body>
</html>「src」属性は、外部 Javascript ファイルにリンクするパスを指定します。上記の例では、ファイル名は「helloworld.js」です。ファイル パスは、HTML ファイルの場所を基準にして指定する必要があることに注意してください。
3. 外部 CDN ライブラリへのリンク
通常の状況では、CDN (コンテンツ配信ネットワーク) から Javascript ライブラリを取得して、サーバーの負荷を軽減し、Web ページの読み込みを高速化できます。スピード。たとえば、jQuery や Bootstrap などのライブラリは、Google や Bootstrap CDN から入手できます。 CDN を使用するには、多くの場合、コード内のリンク パスを CDN のリンクに変更する必要があります。以下に示すように:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>链接CDN库</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<!-- 在这里调用jQuery代码 -->
</body>
</html>上の例では、jQuery の CDN リンクを使用しました。 CDN を使用する場合は、Web サイトのセキュリティを確保するために、比較的安定した CDN アドレスを報告することを選択し、https リンクを使用する必要があることに注意してください。
この記事では、JavaScript を HTML にリンクするさまざまな方法 (JavaScript の埋め込み、JavaScript ファイルの外部リンク、外部 CDN ライブラリへのリンク) を紹介します。最初の 2 つの方法は小規模プロジェクトに適していますが、外部 CDN ライブラリは信頼性と速度が高く大規模プロジェクトに適しています。実際の Web 開発では、プロジェクトの実際の状況、ニーズ、セキュリティに基づいて、適切な Javascript リンクの方法を選択できます。
以上がHTML内でJavaScriptをリンクする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。