logo

HTMLでJavaScript関数を呼び出すにはどうすればよいですか?

HTML ドキュメント内で JavaScript 関数を呼び出す方法は数多くあり、それも難しい作業ではありません。まず、最も簡単な方法の 1 つを使用して、 JavaScript HTMLドキュメント内の関数:

このメソッドでは、HTML ドキュメントの head セクションに関数を作成して定義します。 HTML ドキュメントでこの関数を呼び出すには、単純なボタンを作成し、 オンクリック イベント属性 (イベント ハンドラー) を使用して、ボタンをクリックすることで関数を呼び出すことができます。

これをより明確に理解するために、指定されたプログラムを見てみましょう。

プログラム

 functionmyfunction() { alert(&apos;how are you&apos;); } <p>Click the following button to see the function in action</p> 

プログラムの説明

上記のプログラムでは、単純な HTML ドキュメントを作成しました。 HTML ドキュメントの head セクション内で、関数 ( 例: myfunction();) スクリプトタグ内 ...

 function myfunction() { alert(&apos;how are you&apos;); } 

一方、本文セクション内では、テキストを表示し、ボタンを作成しました。関数を呼び出すために、 オンクリック 属性をボタンとともに指定し、ユーザーがそのボタンをクリックすると関数が実行され、出力に見られるように警告メッセージが表示されます。

次のボタンをクリックすると、実際の機能が表示されます。

出力

HTMLでJavaScript関数を呼び出す方法

外部JavaScriptファイルを使用した関数の呼び出し

HTML ドキュメントに添付された外部 JavaScript ファイルを使用して JavaScript 関数を呼び出すこともできます。これを行うには、まず JavaScript ファイルを作成し、その中で関数を定義し、(.Js) 拡張子を付けて保存する必要があります。

JavaScript ファイルを作成したら、簡単な HTML ドキュメントを作成する必要があります。 JavaScript ファイルを HTML ドキュメントに含めるには、script タグを使用する必要があり、「src」属性で JavaScript ファイルが保存されている場所へのパスを指定する必要があります。外部 JavaScript ファイルを HTML ドキュメントにリンクした後、ボタンを作成し、 関数 を使用して 「クリック時」 それに伴う属性。

プログラムを使ってそれを理解してみましょう。

プログラム

次のボタンをクリックすると、実際の機能が表示されます。

プログラムの説明

上記のプログラムでは、まず JavaScript ファイルを作成し、その中で関数を定義し、. js 拡大。

Function.js

 functionmyfunction() { document.write(&apos;welcome to Javatpoint&apos;); } 

JavaScript ファイルを作成した後、HTML ドキュメントを作成し、 を使用して JavaScript ファイルをリンクしました。 HTML ドキュメントと JavaScript ファイルを同じフォルダーに保存したため、head セクションに完全なパスを指定する代わりに、「scr」属性で JavaScript ファイルに名前を付けました。

 

本文セクション内にテキストを表示し、ボタンを作成しました。関数を呼び出すために、 オンクリック 属性をボタンとともに指定し、ユーザーがそのボタンをクリックすると関数が実行され、出力に見られるように警告メッセージが表示されます。

次のボタンをクリックすると、実際の機能が表示されます。

出力

HTMLでJavaScript関数を呼び出す方法

次に、指定されたボタンをクリックします。

HTMLでJavaScript関数を呼び出す方法