JavaScriptの設定はどこにあるのか-フロントエンドQ&A-php.cn

JavaScriptの設定はどこにあるのか

PHPz

リリース： 2023-04-24 11:21:30

オリジナル

1084 人が閲覧しました

JavaScript は、Web 開発、モバイルアプリケーション、サーバーサイドプログラミングで広く使用されている柔軟なプログラミング言語です。 Web ページのインタラクティブ性とダイナミクスを強化し、ユーザーが Web ページを閲覧する際に、より快適、リッチ、高速になります。ただし、JavaScript がブラウザーで正しく実行されるためには、JavaScript が正しい場所に配置されている必要があります。

JavaScript の設定場所

JavaScript の設定場所は主に 3 つあります:

1. インライン設定

インライン設定とは、タグ内に JavaScript コードを直接埋め込むことです。 HTML ドキュメントでは、この方法は比較的簡単ですが、HTML ドキュメントの読みやすさと保守性に重大な影響を与えるため、お勧めできません。

例:

<button onclick="alert(&#39;Hello, World!&#39;)">Click me!</button>

ログイン後にコピー

このボタンをクリックすると、警告ボックスが表示されます。

2. 内部設定

この設定方法は、HTML の <head> または <body> に JavaScript コードを記述します。 document タグ内の <script> タグ内。この設定はヘッダーまたはボディ部分に配置できます。内部設定のメリットは、HTML文書の読みやすさや保守性が向上すること、場合によってはjsコードがキャッシュされることでサーバーへの負荷が軽減されるため、Webサイトへのアクセス速度が向上することもあります。

例:

<html>
  <head>
    <script type="text/javascript">
      function greeting() {
        alert('Hello, World!');
      }
    </script>
  </head>
  <body>
    <button onclick="greeting()">Say hello</button>
  </body>
</html>

ログイン後にコピー

このスクリプトはドキュメントの先頭で定義されていますが、ドキュメントの本文でも使用されます。

3. 外部設定

この設定方法は、JavaScript コードを別の <.js> ファイルに記述し、 <script&gt ; を使用します。 タグは HTML ドキュメントに導入されます。この設定方法は、コードの再利用と全体の最適化を実現でき、大規模な Web サイトや頻繁な更新が必要な Web サイトに適しています。

例: HTML 文書の構造は次のとおりです。

<!DOCTYPE html>
<html>
  <head>
    <script src="script.js"></script>
  </head>
  <body>
    <button onclick="greeting()">Say hello</button>
  </body>
</html><p> このうち、<code><script></code> タグの src 属性で JavaScript ファイルの導入を指定しています。ファイルの内容は次のとおりです。 </p>
<pre class="brush:php;toolbar:false">function greeting() {
  alert('Hello, World!');
}

ログイン後にコピー

このスクリプトは、外部の script.js ファイル内に単独で存在します。

概要

どのメソッドを使用する場合でも、<body> または <head> (できれば # に配置する必要があります) ##<body>) これにより、ブラウザは JavaScript コードを正しく解析して実行できるようになります。大量の JavaScript コードがある場合は、コードの保守性と全体的なパフォーマンスを向上させるために外部設定を使用することをお勧めします。同時に、互換性の問題にも注意する必要があり、ブラウザーが異なれば、JavaScript コードの同じ部分が異なる方法で解析および実行される可能性があります。

以上がJavaScriptの設定はどこにあるのかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。