- ベストアンサー
jQuery text()で、<br>タグも取得し
jQuery text()で、<br>と<br />タグも取得したいのですが、どうすれば良いでしょうか？ $("p.hoge").html();で取得すると、それ以外のタグも取得されてしまいます。 欲しいのは、「テキスト＋<br>＋<br />」です あるいは、html()で指定範囲を全て取得して、そこから、「<br>と<br />」以外の全てのhtmlタグを削除、 というのは、出来るでしょうか？
- re999
- お礼率61% (476/777)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
かいせつですか…。コードをかくより めんどうだなぁ… -- Array.map は、ある配列をもとに新たな配列を得るために使われます。 Array.filter は、ある配列の中で、条件を満たしたものを得るために使われます。 -- nodeList = document.getElementsByTagName ('xxx'); nodeList = document.getElementById ('xxx').childNodes; nodeList = document.form[0].elements; このように集められるノードリストは、一見すると配列を返しているように思えますが、そうではありません。 配列ではないので Array.map などは使えません。 nodeList.forEach (function (e) { alert (e.tagName); });//このコードは走りません。 -- 以後、理解しやすいように勝手に解釈します。map 関数は、内部にある。その関数はきっと Array.map = map; のようにして、Array に関連付けられている。普通には呼び出せない。その関数を呼び出す方法が、 Array.prototype.map.call (nodeList, cbFunc); -- getSison 関数は、ルートノードを引数に渡すと、まずその子ノードリストを順に調べ、それ以下のノードリストを配列として返します。 ary = [ [3,4,5], [6,7], [8], [9,10] ,........ ]; 戻り値はきっと上のようになるかもしれない。（子ノードの数で配列の大きさが変化する） この配列を一気に一つの配列にする方法は、ないものだろうか？ 配列をつなげる関数は、concat 。 var ary = [0,1,2].concat ([3,4,5], [6,7], [8], [9,10]); // ary = [0,1,2,3,4,5,6,7,8,9] map と同じように concat 関数そのものを呼び出すには、 var ary = Array.prototype.concat.call ([0,1,2], [3,4,5], [6,7], [8], [9,10]); しかし、子ノードの数で concat に渡す引数が変化してしまう。 上の式で言えば、getSison 関数で、root ノードの子ノードは、[[3,4,5], [6,7], [8], [9,10]]のような形で配列になって返される（再帰処理で）。 var child = [[3,4,5], [6,7], [8], [9,10]]; var ary = [root]; var rst = Array.prototype.concat.apply (ary, child); call ではなく、 apply を使って呼び出すと child の配列の数が何個でも concat 関数の引数として渡される。 つまり、引数として渡された配列は、すべて１つになる。 -- >> var sison = getSison (document.getElementById ('hoge')).filter (isTarget); の、 getSison (document.getElementById ('hoge')) は、hoge をルートとする子孫ノードを配列として返す。 [hoge, node0, node1, .....] このリストから、目的のノードを Array.filter で選別する。 -- で、かいせつに なっているだろうか？
その他の回答 (1)
- babu_baboo
- ベストアンサー率51% (268/525)
またも、jQuery なんて つかわなくても あつめられます。 しそんノードをあつめて、ひつようなノードだけを はいれつにして かえします。 「削除」のほうは、ひとまかせにします。 Array.map と Array.filter が ひつようです。 <!DOCTYPE html> <title></title> <meta charset="UTF-8"> <div id="hoge"> <p> 1<em>2</em>3<br> 4 </p> <p> 5<br> 6 </p> </div> <script> function isTarget (n) { return ((3 === n.nodeType) || 'BR' === n.tagName); } function getSison (n) { return n.hasChildNodes () ? Array.prototype.concat.apply ([n], Array.prototype.map.call (n.childNodes, getSison)) : n; } var sison = getSison (document.getElementById ('hoge')).filter (isTarget); </script>
補足
かいとうありがとうございました。 だけど、かいているないようがむずかしいので、かいせつしていただくことはかのうでしょうか？ 初めの、 filter (isTarget); では、「テキストかbrタグだったら、新しい配列を作る」、ということなのでしょうか？ getSison関数に渡された引数に子ノードがあったら、 何をしているのでしょうか？ Array.prototype.concat.apply ([n],？？？ 再び、元の関数を呼んでいるので、 Array.prototype.map.call (n.childNodes, getSison)) 再帰処理とかなのでしょうか？
お礼
回答ありがとうございました。 ＞かいせつですか…。コードをかくより めんどうだなぁ… ごめんなさい…… ＞で、かいせつに なっているだろうか？ 詳細ありがとうございました。ものすごく(解説に)なっています。 大変、勉強になりましたー！