JavaScript xxx.getElementsByTagName is not a functionの解決方法
環境
Google Chrome 114.0.5735.199(Official Build) (64 ビット)
Windows 11 Pro 64bit
修正前コード
<div class="yy"><p>study</p><p>bbb</p></div> <div class="yy"><p>skill</p></div> <div class="yy"><p>d2222</p><p>eee</p></div> <button>テスト</button> <script> function funA() { const elems = document.getElementsByClassName('yy'); console.log(elems); // HTMLCollection(3) [div.box, div.box, div.box] const result = elems.getElementsByTagName('p'); console.log(result); } </script>
エラーメッセージ
Uncaught TypeError: elems.getElementsByTagName is not a function
対策
HTMLCollection要素を指定して実行する場合、インデックス番号を指定してDOM要素を取得します。
修正後コード
<div class="yy"><p>study</p><p>bbb</p></div> <div class="yy"><p>skill</p></div> <div class="yy"><p>d2222</p><p>eee</p></div> <button>テスト</button> <script> function funA() { const elems = document.getElementsByClassName('yy'); console.log(elems); // HTMLCollection(3) [div.box, div.box, div.box] const result = elems[0].getElementsByTagName('p'); console.log(result); } </script>