2019-07-26 07-27 到達点メモ

2019-07-26 07-27 到達点メモ

  7月 28, 2019    nonoNaga

---

.text()を行う際にDOM操作をする際にそもそもタグの指定が間違っていないか
確かめたい時は.html()でやると
テキストデータを取得する方法としては間違っていないが
タグの指定は間違っていないかどうかが分かる。

例えば、以下の様なテーブル構造があったとする

<table class="test_tag nononaga_tag">
  <tr>
    <th>TEST</th>
    <td><a rel="nofollow" target="_blank" href="https://www.nononagainfo.com/">https://www.nononagainfo.com/</a></td>
  </tr>
</table>
この際に、欲しいデータが、tdタグのURLアドレスだった場合、
$ ('table.test_tag').text ();
もしくは、
$ ('table.nononaga_tag').text ();
では取得できない。

この場合、正しいやり方は以下のどちらかである。
$ ('table.test_tag td').text ();
$ ('table.nononaga_tag td').text ();
＊理由はよくわかっていないが、 ('table.test_tag table.nononaga_tag  td').text ();
では取得できない。何か指定方法が間違っているのかもしれない。

大体目標の作業は終わったと思う。
これで作業がグッと楽になるはず。

例えば、以下の構造があったとして
ノノナガというデータを取りたいとする。
<div class="job_type">
  <div class="programmer">
    <span class="user_name">
    ノノナガ
    </span>
  </div>
</div>

その場合は、以下のようにすればよい
$('.job_type').find('.user_name')

参考サイト：jQueryで子要素を取得する方法：children(), find()
https://uxmilk.jp/10873

jQueryとJavaScriptがごっちゃになってしまってるので気を付けないといけない
.find()はjQueryの話。

タグ内に不要な改行が入っており、且つそれがブラウザ上で反映されていないので
その表示に近づけたい場合は、以下のようにやればよい。

◆htmlでのデータ
<p>


あいうえお
</p>


◆ブラウザでの表示
あいうえお

var copyHtml = '<p>' + $ ('.aiueo').html ().replace (/\n/g, '') + '</p>';
var copyText = $ (copyHtml).text ();
console.log (copyText);

一旦HTMLデータを出力し、そこでreplaceで改行(\nのことで<br>のではない)
そのあと、タグが消えるのでhtmlに戻すためにpタグで囲んでやる

他のごみデータの削除もこれで対処できるかもしれない。

今日はここまで。