外部JavaScriptの関数を呼び出す方法とは【メンターが回答】

「外部JavaScriptファイルから別の外部JavaScriptの関数を呼び出す方法とは。」という質問にTechAcademyの現役エンジニアが解決方法を回答しています。ぜひ理解しておきましょう。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

※TechAcademyに実際に寄せられた質問に現役エンジニアのメンターが回答しました。

 

田島悠介

質問に対して現役のエンジニアが回答していくシリーズだね!

大石ゆかり

今回はどういう質問でしょうか?

田島悠介

JavaScriptファイルから外部JavaScriptファイルの関数を呼び出す方法だね!実際に回答してもらった内容を紹介するね!

大石ゆかり

お願いします!

質問

C#でプロジェクトの改修をしていて、外部jsファイルから別の外部jsファイルの関数を呼び出したいと思っています。

調べて以下該当のソースコードの方法を試しましたが、うまくできませんでした。

hoge.jsを使用しているHTML (該当のソースコード HTML)です。

 

該当のソースコード

JavaScript

function piyo.js(form,url) {
  // フォームとurlを指定してwindow.openでurl先を開く処理.
  window.open(url);
}

###hoge.js
function hogefunction(form) {
  document.write("<script type='text/javascript' src='piyo.js'>");
  window.onload = function(){piyofunction(form, url);};
}

HTML

<head>
// 略
 <script type="text/javascript" src="../Scripts/hoge.js"></script>
</head>
<body>
// 略
 <input type="button" value="button" onClick="hogefunction(document.forms[0], '../Views/a.cshtml')">
</body>

 

[PR] JavaScript・jQueryで挫折しない学習方法を動画で公開中

メンターからの回答

基本的にはjQuery等使うといいと思います。

$.getScript("piyo.js");

この様に記述するだけで読み込むことができ、変数や関数を使うことができます。

 

以上、JavaScriptファイルから外部JavaScriptファイルの関数を呼び出す方法について解説しました。

TechAcademyでは、現役JavaScriptエンジニアのメンターが質問にすぐ回答します。

他にもJavaScriptでグローバル変数を取得する方法についてメンターが回答しているので、合わせてご覧ください。

 

回答してくれたメンター

小芝 涼太(こしばりょうた)

Webアプリケーションエンジニア。

Vue.jsを用いたフロントエンド開発を中心に、UXデザインなども行なっております。

 

大石ゆかり

回答分かりやすかったです!

田島悠介

ゆかりちゃんも分からないことがあったら質問してね!

大石ゆかり

分かりました。ありがとうございます!

 

TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース(JavaScript・jQuery講座)を開催しています。プログラミングの初心者でも受講可能です。

現役エンジニアがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、最短4週間でオリジナルWebサービスを開発することが可能です。

独学に限界を感じている場合はご検討ください。