JavaScriptの起動時に問題が表示されません

質問

JavaScriptの初期画面起動時に問題が表示されません

https://techacademy.jp/magazine/22769

これを表示させたいです。
// 初期画面起動時
var Question = [
["JavaScriptで「Hello World」を正しく表示されないのはどれ？",

ご教授よろしくお願いします。

回答No.1

asciiz · ベストアンサー

JavaScriptが動かなかったなら、F12キーを押して「デベロッパー ツール」ウインドウを表示。

コンソールログには、次のエラーが表示されて止まっています。

＞quiz.html:58 Uncaught TypeError: Cannot set properties of null (setting 'textContent')
＞ at Q_Set (quiz.html:58)
＞ at quiz.html:54
※quiz.html は私が保存したファイル名

何やら、「Q」オブジェクトが取得できていない様子?

＞var Q = document.getElementById('_question');

で取ってきているはずなのですが…と。

ここでデベロッパー ツール ウインドウの「Elements」タブでHTMLソースを見てみると、「ここに問題が表示されます。」の行がなんか変です。

＞<h2 id="”_question”">ここに問題が表示されます。</h2>

idを囲っているダブルクォーテーションが二重になっています…
あ、内側のダブルクォート、全角だーー！？

つまり、元の掲載ソースが間違っています。
誤) <h2 id=”_question”>ここに問題が表示されます。</h2>
正) <h2 id="_question">ここに問題が表示されます。</h2>

ダブルクォートを間違ったせいで、「_question」というIDではなく「”_question”」というダブルクォートを含んだIDになってしまっていて、「Q = document.getElementById('_question');」でマッチせず、オブジェクト取得できていなかったという訳です。

ダブルクォーテーションを半角で書きなおしたところ、きちんとクイズスクリプトが動くようになりました。

誰からも指摘されて無いんですかね…。

お礼

ありがとうございました。とても助かりました。