MW211 EXIT

devlog
jQuery/tdタグ直下にテキスト文だけ除去
2018年08月05日
例えば以下のようにtdタグ直下にテキスト文とタグが混在していて
テキストだけ除去する方法。
┌──────────────────────────────────────┐
│<td>あいうえお<input type="text" value="かきくけこ"/></td>                  │
└──────────────────────────────────────┘

ちなみにタグ側だけ削除するには、以下みたいな感じで簡単なのだが。
┌──────────────────────────────────────┐
│$('td').children().remove();                                                │
└──────────────────────────────────────┘

一番確実な対処法としてはtd直下にテキストを置くのではなく、spanタグを介する方法。
┌──────────────────────────────────────┐
│<td><span>あいうえお</span><input type="text" value="かきくけこ"/></td>     │
└──────────────────────────────────────┘
そうすると以下のように素直に処理ができる。
┌──────────────────────────────────────┐
│$('td').children('span').remove();                                          │
├──────────────────────────────────────┤
│$('td').children().remove('span');                                          │
└──────────────────────────────────────┘

とはいえ、spanタグを今さら追加できないという事情の場合の対処方法。
すばり、テキストで取得したものを置換で除去してしまう!
┌──────────────────────────────────────┐
│$('td').html(                                                               │
│    $('td').html().replace($('td').text(), '')                              │
│);                                                                          │
└──────────────────────────────────────┘
なお、.text()は改行を認識するが、.html()は改行を除去してしまうという特性があり
たいていは上記ではうまくいかないようだ。
(<td>から</td>まで一行で書かれている場合のみうまくいく)

ということで、改行コードを除去した上で置換すればいけそうだ。
┌──────────────────────────────────────┐
│$('td').html(                                                               │
│    $('td').html().replace(                                                 │
│        $('td').text().replace(/\n/g, ''),                                  │
│        ''                                                                  │
│    )                                                                       │
│);                                                                          │
└──────────────────────────────────────┘
分類:jQuery