質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
86.02%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

JavaScriptファイルの戻り値をブラウザ上に表示させたい。

byamadaro1013
byamadaro1013

総合スコア6

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

1回答

0グッド

0クリップ

743閲覧

投稿2023/02/03 01:09

プログラミング初心者ですがどうぞよろしくお願いいたします。

実現したいこと

JavaScriptファイルの戻り値をブラウザ上に表示させたい。

前提

HTMLファイルに2つのJSファイルを読み込み、ブラウザ上で戻り値を表示させようとしております。
既にHTMLファイルでは2つのJSファイルの読み込みは完了しているかつ、関数も記載しているのですがうまく動作しません。

発生している問題・エラーメッセージ

コンソール上では以下のように記載されていますが、getDateは別ファイルで定義しているつもりで原因がわかりません。

エラーメッセージ station12-common.js:1 Uncaught ReferenceError: getData is not defined ### 該当のソースコード ```HTML ソースコード <!DOCTYPE html> <html lang="ja"> <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>Station 12</title> <script src="./scripts/station12-common.js"></script> <script src="./scripts/station12.js"></script> </head> <body> <div class="card-container"> <div class="card"> <p id="result"></p> </div> </div> </body> </html> ```JSファイル1 function getData() { return "テスト"; } ```JSファイル2 var result = getData(); var elem = document.getElementById("result"); elem.innerHTML = result; ### 試したこと こちらのサイト内やいろいろ戻り値についても調べましたがわからず途方にくれています。。 どうぞよろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

byamadaro1013

2023/02/03 02:39

ありがとうございます!scriptタグの位置をかえてうまくいきました。感謝申し上げます。

回答1

1

ベストアンサー

station12-common.js:1 Uncaught ReferenceError: getData is not defined

station12-common.js が「JSファイル2」、station12.js が「JSファイル1」だと思われますが、それなら、以下の<script>2つの順番を入れ替える必要があります。先に function getData() ... を実行する必要があるためです。

html

1 <script src="./scripts/station12-common.js"></script> 2 <script src="./scripts/station12.js"></script>

また、入れ替えなくても「JSファイル2」のコードをHTML文書のパーズ後に実行すれば色々と都合がよいでしょう。

js

1document.addEventLisetner('DOMContentLoaded', () => { 2 const result = getData(); 3 const elem = document.getElementById("result"); 4 elem.innerHTML = result; 5}

投稿2023/02/03 01:42

int32_t

総合スコア17794

yambejp👍を押しています

下記のような回答は推奨されていません。

  • 質問の回答になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

このような回答には修正を依頼しましょう。

回答へのコメント

byamadaro1013

2023/02/03 02:38

ありがとうございます!順番を変えることでうまくいきました。ありがとうございました。

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
86.02%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。