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

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

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

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

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

Q&A

解決済

2回答

573閲覧

DOM操作で任意の値を取得することができない

hiroo_mokumoku

総合スコア128

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

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

0グッド

0クリップ

投稿2020/05/18 13:15

編集2020/05/18 13:18

いつもお世話になってます。javascript初学者です。
現在、テーブルから指定した値を取得するプログラムを作成してます。

やりたいこと

テーブルの中に含まれているアルバイト・パートと記載のある箇所から値を取得したい。

今、困っていること

tr要素までは取得される。ループ処理を利用して指定した値を取得しようとするもうまく取得することができない。

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

VM4841:4 Uncaught TypeError: tr.replace is not a function at <anonymous>:4:13

該当のソースコード

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Document</title> 7</head> 8<body> 9 <table class="table"> 10 <tr> 11 <th>施設名</th> 12 <td> 13 <h3>テストテスト</h3> 14 </td> 15 </tr> 16 <tr> 17 <th>施設種類</th> 18 <td>テスト・テスト</td> 19 </tr> 20 <tr> 21 <th>定員</th> 22 <td>19名</td> 23 </tr> 24    <tr> 25 <th>雇用形態</th> 26 <td>アルバイト・パート</td> 27 </tr> 28 <tr> 29 <th>職種</th> 30 <td>テスト</td> 31 </tr> 32 <tr> 33 <th>応募資格</th> 34 <td>テスト資格をお持ちの方</td> 35 </tr> 36 <tr> 37 <th>勤務地</th> 38 <td>群馬県前橋市テスト1-1</td> 39 </tr> 40 </table> 41 <script> 42 var tr = document.getElementsByTagName("tbody")[0].getElementsByTagName("tr"); 43 for (var i = 0; i < tr.length; i++) { 44 if (tr[i].innerText.indexOf("雇用形態") != -1) { 45 tr = tr.replace(/雇用形態/g, "").replace(/^\s+|\s+$/g, ''); 46 console.log(tr); 47 } 48 } 49 </script> 50</body> 51</html>

試したこと

一部をコメントアウトするとtr要素は取得されます。しかし、tr要素以降の値が取得されないのは何故でしょうか?
勉強不足で申し訳ございませんがご教示頂ければと思います。

javascript

1var tr = document.getElementsByTagName("tbody")[0].getElementsByTagName("tr"); 2for (var i = 0; i < tr.length; i++) { 3 if (tr[i].innerText.indexOf("雇用形態") != -1) { 4 // tr = tr.replace(/雇用形態/g, "").replace(/^\s+|\s+$/g, ''); 5 console.log(tr); 6 } 7} 8// HTMLCollection(7) [tr, tr, tr, tr, tr, tr, tr]

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yambejp

2020/05/18 13:28

thが雇用形態の隣のtdの値(テキスト)を取りたいのでしょうか?
guest

回答2

0

ベストアンサー

tr.replace is not a functionというエラーメッセージのとおりです。trはDOM要素を入れたコレクションなので、それ自体にreplaceメソッドはありません。

投稿2020/05/18 13:20

maisumakun

総合スコア145201

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

hiroo_mokumoku

2020/05/23 11:09 編集

今回のベストアンサーとさせて頂きます。 他の方々もご回答頂きありがとうございました。
guest

0

javascript

1var datas=[...document.querySelectorAll('th')].filter(x=>x.textContent=="雇用形態").map(x=>x.nextElementSibling.textContent); 2console.log(datas);

投稿2020/05/18 13:33

yambejp

総合スコア114928

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.47%

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

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

質問する

関連した質問