JavaScriptのjsファイルの書き方-フロントエンドQ&A-php.cn

JavaScriptのjsファイルの書き方

WBOY

リリース： 2023-05-16 09:10:37

オリジナル

6181 人が閲覧しました

JavaScript は、Web ページ上でインタラクション、動的効果、データ操作などの機能を実装できる強力なプログラミング言語です。 JS ファイルは JavaScript コードの記憶媒体です。この記事では、JS ファイルの書き方を紹介します。

1. JS ファイルの作成

JS ファイルは、メモ帳、Sublime Text、Visual Studio Code などのテキストエディターまたは JS 開発ツールを使用して作成できます。 JS ファイルを作成するには、新しい空のテキストファイルを作成し、「index.js」、「script.js」などのファイル名の末尾を .js にするだけです。

2. JS ファイルの基本構造

JS ファイルの基本構造は次の部分で構成されます:

1. コメント
コメントは JS コードで重要ですこれは、コードの機能とロジックをより深く理解し、後のメンテナンスや変更を容易にするのに役立ちます。コメントには「//」または「/ /」を使用できます。前者は単一行のコメントを表し、後者は複数行のコメントを表します。

2. 関数宣言
関数は JS コードの基本単位であり、一連の JavaScript ステートメントをカプセル化して再利用可能なブロックを形成し、コードの再利用とモジュール開発を実現します。関数宣言は、「function」キーワードを使用し、括弧内に関数パラメーターと関数本体を追加して作成できます。

3. 変数宣言
変数は JS コード内のメモリであり、数値、文字列、オブジェクトなどのさまざまなタイプのデータを格納するために使用されます。変数宣言は、「var」、「let」、または「const」キーワードを使用し、変数名の後に値を追加して作成できます。

次は、JS ファイルの基本構造です:

//此处为单行注释
/*
此处为多行注释
*/

//函数声明
function functionName(parameter1, parameter2) {
   //函数体
}

//变量声明
var variableName = value;
let variableName = value;
const variableName = value;

ログイン後にコピー

3. JS ファイルのコード例

以下は、JS を示すいくつかの JS ファイルのコード例です。ファイルの一般的な使用法:

1. 要素の背景色を赤に変更する:

document.getElementById("element_id").style.backgroundColor = "red";

ログイン後にコピー

2. 配列を作成する:

let myArray = [1, 2, 3, 4, 5];

ログイン後にコピー

3. 変数を宣言して代入するit to String:

let myString = "Hello, World!";

ログイン後にコピー

4. 配列要素をループして出力:

for (let i = 0; i < myArray.length; i++) {
   console.log(myArray[i]);
}

ログイン後にコピー

4. JS ファイルの導入方法

JS ファイルは以下の 3 つで導入できます。方法:

1. 内部 JS
HTML ファイルの「script」タグを使用して、JS ファイルを導入します。このタグは、以下に示すように、HTML ファイルの先頭または末尾に配置できます。

<!DOCTYPE html>
<html>
<head>
   <title>My Page</title>
   <script type="text/javascript" src="my_script.js"></script>
</head>
<body>
<!-- HTML 页面内容 -->
</body>
</html>

ログイン後にコピー

2. 外部 JS
外部 JS ファイルを HTML ファイルに導入すると、以下に示すように絶対パス参照または相対パス参照を使用できます:

<script type="text/javascript" src="https://example.com/my_script.js"></script>

<script type="text/javascript" src="/js/my_script.js"></script>

ログイン後にコピー

3. インライン JS
Use HTML ファイルの onload、onclick 他のイベントに属性をバインドし、以下のように JS コードを導入します:

<button onclick="myFunction()">Click me</button>

ログイン後にコピー

以上が JS ファイルの作成、基本構造、コード例、導入方法でした。 JavaScript プログラミングと JS ファイルの書き方をより深く理解するのに役立ちます。

以上がJavaScriptのjsファイルの書き方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。