ホームページ > 記事 > ウェブフロントエンド > JavaScript で js ファイルをインポートする 2 つの方法
HTML
で大量のコードが表示されるのを避けるために、通常は js スクリプト
を別のファイルに入れることを選択します。そして、js ファイル
が HTML
にインポートされ、HTML
ファイルがより簡潔になります。この記事では主に、js スクリプト# をインポートする 2 つの方法を紹介します。 ##: : 従来のインポート、モジュールのインポート。
js スクリプト の場所を確認します。この記事は、
HTML ファイルと同じパスにあります。
1. 従来のインポート:
JS スクリプト コンテンツ://文件名:example.js let a="呵呵姑娘";HTML コンテンツ:
<!-- example.html --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="./example.js"></script> <script> console.log(a); </script> </body> </html>
2. モジュールのインポート:
JS スクリプトのコンテンツ://文件名:example.js let a="呵呵姑娘"; export {a};HTML コンテンツ:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script type="module"> import {a} from './example.js'; console.log(a); </script> </body> </html>
推奨: 「2021 js インタビューの質問と回答 (大要約)」 ##js チュートリアル>>
以上がJavaScript で js ファイルをインポートする 2 つの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。