Q&A
前提・実現したいこと
JavaScriptを利用して『ボタンをクリックしたときに要素を開いたり閉じたりする』というアニメーションを実装しようとしています。
しかし、「Uncaught TypeError: Cannot read property ‘display’ of undefined」というエラーメッセージが表示されてしまい、実装することができません・・・
エラーの対処方法を教えてください。
発生している問題・エラーメッセージ
Uncaught TypeError: Cannot read property ‘display’ of undefined
該当のソースコード
HTML
1<html> 2 <head> 3 (省略) 4 </head> 5 6 <body> 7 <div class="submit"> 8 <input type="submit" name="chat" id="chat-submit" value=”開く" onclick="ffffBtn();"> 9 </div> 10 11 <div class="container"> 12 (省略) 13 </div> 14 15 <script type="text/javascript" src="script.js"></script> 16 </body> 17</html> 18
JavaScript
1 2document.getElementsByClassName("container").style.display = "none"; 3 4function ffffBtn(){ 5 const zzzz = document.getElementsByClassName('container'); 6 7 if(chat.style.display = "block"){ 8 zzzz.style.display = "none"; 9 } else { 10 zzzz.style.display = "block"; 11 } 12}
試したこと
ファイル（<script type="text/javascript" src="script.js"></script>）の読み込み位置、スペルチェックなどは行いました。
また、こちらの記事（https://sbfl.net/blog/2019/02/01/javascript-error-messages/）を読んだのですが、
”エラーの理由：undefinedの’プロパティ名’にアクセスしている” ・・・・・どういうこと？？？ という状態です。
JavaScriptの学習を初めて３日目なので、右も左もわからない素人ですが、教えていただけると幸いです。
補足情報（FW/ツールのバージョンなど）
https://itsakura.com/javascript-display#s1
こちらの記事を参考にしました。
回答3件
0
同じ問題での投稿って結構あると思います（ここ１週間内でも２回くらい回答した気がする）
[getElementsByClassName tag:JavaScript] の検索結果： 401件
投稿2020/01/31 19:16
総合スコア80888
0
【Element.getElementsByClassName() - Web API | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Element/getElementsByClassName
elements は見つかった複数の要素のライブな HTMLCollection です
【getElementsByClassNameとgetElementByIdの返り値の違い - Qiita】
https://qiita.com/rindarinda5/items/c26dc81fe8cd98992dc1
投稿2020/01/31 19:05
総合スコア69625
0
ベストアンサー
エラーの対処方法
- 簡単な英語なので、翻訳してでも読む。（これは出来ていると思います）
- 関連する行が開発者コンソールに示されているので、クリックしてソースの該当箇所を知る。
- 該当箇所付近で利用している関数の引数と返値/構文等に誤りがないかを確認する。
DOMのAPI （ご質問では document.getElementsByClassName() ）と思われます。
- getElementsByClassName()
もコンピュータに対する英語の命令文です
（「getしろ、複数の要素(を)、class名(で)」というイメージ）。
コンピュータで示される英語は、直訳する必要はないです。
追記）
JavaScriptの学習を初めて３日目なので
どんな言語も、慣れないうちは、ワンライナーで短く書くことより、
「１行に１文」という「愚直な方法を取る」と身につきやすいですよ。
投稿2020/01/31 22:30
編集2020/01/31 22:46
総合スコア5434
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。