Q&A
変数text に想定通りの情報がちゃんと取れてるか確認しましたか？
いつもお世話になっております。
javascript初学者です。
今回はcontinueの処理が通らない理由が分からないのでこの場を借りて質問しました。
下記にjavascriptで書いたプログラムがあります。
このプログラムはHTMLの中に含まれるtrタグを書き出しfor文で回します。
もし、合致した場合はcontinueですっ飛ばし、合致しなかった場合はあいうと書かれているテーブルの色を変えたい簡易的な処理です。
HTML
1<!DOCTYPE html> 2<html> 3 <head> 4 <title>基本的な表の作成</title> 5 </head> 6 <body> 7 <table border="1" width="300" height="300" id="table"> 8 <tr> 9 <th>名前</th> 10 <th>テキスト</th> 11 </tr> 12 <tr> 13 <td>田中</td> 14 <td class="test">あああ</td> 15 </tr> 16 <tr> 17 <td>佐藤</td> 18 <td class="test">あああ</td> 19 </tr> 20 <tr> 21 <td>高橋</td> 22 <td class="test">あいう</td> 23 </tr> 24 <tr> 25 <td>山田</td> 26 <td class="test">あああ</td> 27 </tr> 28 <tr> 29 <td>鈴木</td> 30 <td class="test">あああ</td> 31 </tr> 32 <tr> 33 <td>斎藤</td> 34 <td class="test">あああ</td> 35 </tr> 36 <tr> 37 <td>石井</td> 38 <td class="test">あいう</td> 39 </tr> 40 </table> 41 42 <script src="191206.js"></script> 43 </body> 44</html> 45
javascript
1var td; 2var tr = document.getElementsByTagName("tr").length; 3 4for (var i = 0; i < tr; i++) { 5 var td = document.getElementsByTagName("tr")[i].getElementsByTagName("td")[1]; 6 if (td == "あああ") { 7 continue; 8 } else { 9 var text = document.getElementsByTagName("tr")[i].getElementsByTagName("td")[1]; 10 text.style.color = "red"; 11 } 12}
わからないこと
色を変えたい処理を作成してますが下記のエラーメッセージが出てしまいます。
エラ〜メッセージ
Uncaught TypeError: Cannot read property 'style' of undefined
DOMから取得を試みていますが、何故このようなエラーメッセージがでるのかが理解できてません。
質問内容が分かりづらくて申し訳ないですがエラーの原因をご教示頂けたら幸いです。
確認しました。
取得の確認が取れたので「style.color」を使って色を変えようとしたところエラーで怒られてしまいました。
何故、怒られている理由を知りたくて質問しました。
どのように？書かないと誰にも伝わりません。
回答1件
0
何故このようなエラーメッセージがでるのかが理解できてません。
テーブルの最初の行は<th>しか入っていないので、getElementsByTagName("td")とすると空振りになってしまいます。
投稿2019/12/07 08:12
総合スコア145975
この行はもちろんtd == "あああ"に一致しませんし、getElementsByTagName("td")[1]とした結果はundefinedになりますので、styleを参照しようとしてエラーになります。
アドバイスありがとうございます。
自分の書いたコードを見直します。
あなたの回答
tips
プレビュー
