• ベストアンサー

文字列より<・・・>を削除する方法

お世話になります。 s='<div style="・・・">あいうえお</div>'; とか s='<span style="・・・">あいうえお</span>'; などを s='あいうえお'; としたいのですが、 s=s.replace(/\<.+\>/,''); とすると、 s='' となってしまいます。 gオプションを付けて s=s.replace(/\<.+\>/g,''); としても同じです。 どうしたらできるかおわかりの方見えましたら 教えていただけないでしょうか。 よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
  • notnot
  • ベストアンサー率47% (4856/10271)
回答No.1

繰り返し指定の + は最長の文字列にマッチするので、<.+>は、s 全体にマッチします。最小マッチの +? を使って、s.replace(/<.+?>/g,"") ですね。 JavaScriptは上記で大丈夫ですが、言語によっては最小マッチの機能がないのでその場合は、/<[^>]+>/ とします。 以下余談。 HTML以外を扱う一般論だとまた違ってきます。HTMLの場合はタグの< >の中に、属性値などで < や > が出てくる事はないのですが、例えば「PHPのタグを消したい」とかで、/<\?php.+?\?>/ とすると、<?php echo "?>"; ?> が駄目です。こういった場合は、正規表現いっぱつではまず無理でしょうね。

rqg2010
質問者

お礼

notnotさん、お早うございます。 お礼が遅くなり申し訳ありません。 できました。 どうもありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (1)

noname#84373
noname#84373
回答No.2

var str = '<div>あいうえ<span><em>お</em></span>.</div>'; var tmp = document.createElement('div'); tmp.innerHTML = str; var text = tmp./*@cc_on @if (1) innerText @else@*/ textContent /*@end@*/; alert(text);

rqg2010
質問者

お礼

_pipi_さん、お早うございます。 お礼が遅くなり申し訳ありませんでした。 こんな方法もあるとは驚きです。 とても参考になりました。 どうもありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 文字列の<>で囲まれた文字列を一括削除する方法

    サイトのソースで、本文に<br>、</div>などのHTMLタグが挿入されていますが、 これらのタグを一括して削除する方法はないでしょうか。 私が最初に試したのは、ソースをメモ帳に張り付けて、置換機能を利用して ワイルドカードを使い、<*>の文字列を空白に置き換える方法ですが、 上記のようなタグがあるにも関わらず、該当する文字列がないと エラー表示され置換できません。 具体的には、以下のように編集したいです。 (置換前) <div class="t_h ">7: <span style="color: green; font-weight: bold;">名無しさん</span> <span style="color: gray;"> 2013/09/26(木) 15:55:59.62 ID:FahaifvL0</span></div> <div class="t_b " > 山田太郎だったら営業に有利そうだな </div><br /> (置換後) 7: 名無しさん2013/09/26(木) 15:55:59.62 ID:FahaifvL0 山田太郎だったら営業に有利そうだな どなたかいい方法を教えていただけますでしょうか。 よろしくお願いします。

  • spanを使わずに文字列の一部を赤色にする方法

    HTML/CSSについて教えてください。 文字列の一部を赤色にしたいとき、インラインで記載すると以下のようになると思います。 <span style="color:#FF0000;"> samplesamplesample </span> 上記内容を、 「span」を使わずにインラインで記載する方法を教えて欲しいです。 (HTML5用でお願いします) ※ググったところ、 <div style="display:inline;color:#FF0000;"> samplesamplesample </div> という書き方でよさそうに思うのですが、詳しくないのでよく分からず・・。 <font style="color:#FF0000;"> samplesamplesample </font> という書き方が、やりたいことに最も近い気がしますが、HTML5では禁止?されていると知りました。 恐れ入りますが、どなたかよい方法をお教えくださると嬉しいです。

    • ベストアンサー
    • CSS
  • 文字列からある部分のみを削除したい

    javascriptでamazonのRSSから取得したcontentからある部分だけを削除したいです。 <div style="float:left"><a href="http://www.amazon.co.jp/%E3%80%8C%E5%81%BD%E7%89%A9%E8%AA%9E%E3%80%8D%E7%AC%AC%E4%B8%80%E5%B7%BB-%E3%81%8B%E3%82%8C%E3%82%93%E3%83%93%E3%83%BC%EF%BC%88%E4%B8%8A%EF%BC%89%E3%80%90%E5%AE%8C%E5%85%A8%E7%94%9F%E7%94%A3%E9%99%90%E5%AE%9A%E7%89%88%E3%80%91-Blu-ray-%E6%96%B0%E6%88%BF%E6%98%AD%E4%B9%8B/dp/B006W6JSY0/ref=pd_zg_rss_ts_d_dvd_1?ie=UTF8&amp;"><img src="http://ecx.images-amazon.com/images/I/51G25p4m8mL._SL160_.jpg" alt="偽物語第一巻かれんビー上完全生産限定版 Bluray" border="0" hspace="0" vspace="0"></a></div><span><a href="http://www.amazon.co.jp/%E3%80%8C%E5%81%BD%E7%89%A9%E8%AA%9E・//以下略 上記の部分から <img src="http://ecx.images-amazon.com/images/I/51G25p4m8mL._SL160_.jpg" alt="偽物語第一巻かれんビー上完全生産限定版 Bluray" border="0" hspace="0" vspace="0"> を抽出し、かつamazonの画像オプション_で囲まれた部分を削除し、 <img src="http://ecx.images-amazon.com/images/I/51G25p4m8mL..jpg" alt="偽物語第一巻かれんビー上完全生産限定版 Bluray" border="0" hspace="0" vspace="0"> としたいのですがうまくいきません。 replaceでできるかと思い var entry = result.feed.entries[i]; var gazo = entry.content.match("<img.*jpg.*?>"); /* <img src~vspace="0">まで抽出 */ gazo = gazo.replace(/_*_/, ""); /* _で囲まれ部分を削除 */ としてみたのですが、replaceの部分を実行するとnot functionとでてしまいます。 FC2ブログなのですが、javaのバージョンがreplaceが使えないバージョンなんでしょうか? それとも根本的にコードが間違ってるのでしょうか? あるいは他のやり方を教えていただきたいと思います。

  • 選んだ文字列を表示させる方法について

    JavaScriptを使って,ドラッグで選んだ文字列を,同じページ内に,抜き出して表示させることを考えています。 いろいろなページを参考にして,以下のように作ってみましたが,どうもうまく動きません。 具体的には,文字を選ぶと[object]と表示されてしまいます。 アドバイスをお願いします。 <html lang="ja"> <head> <script type="text/javascript"> function doAlert(){ if(document.all){ var s = new String; s=document.selection.createRange(); if (document.all) { his.innerHTML = s; } else if ( document.layers ) { document.his.document.open(); document.his.document.write(s); document.his.document.close(); } }else if(document.getElementById){ s=window.getSelection(); document.write(s); } } document.onmouseup=doAlert; </script> </head> <body> <div id="div1" style="font-size:24pt"> 選択してください。 </div> <hr> <DIV id="his" style="position: absolute;"> <P>上の文をドラッグすると,ここに選んだ文字列が表示されます</P> <hr> </DIV> </body> </html>

  • 画像を重ねて表示する方法を知りたいです。

    おせわになっております。 下記のようなソースを作りました。 ------------------------------------------------- <div style="position: relative;"> <img src="sideback.gif" width="182" height="812" alt="sideback"> <div style="position: absolute; top: 30px; left: 15px;"> <span style="position:absolute; top:10px; left:10px"><img src="sidemanu-canner.gif" alt="メニュー"> </span> </div> </div -------------------------------------------------- 画像を重ねたいんですが、firefoxでプレビューすると (IEでも同じです。) 下の画像(背景)の上に上の画像が表示されるはずだった場所に四角い3つぐらい色のついたマークがでて (IEは小さな資格に×マーク) 上に表示されるはずだった画像が表示できません どうしたらいいでしょうか?

    • ベストアンサー
    • HTML
  • box の左端と右端に書いた文字の下端を揃えるにはどうすれば

    box の左端と右端に書いた文字の下端を揃えるにはどうすれば よいでしょうか。 <div style="width:200px;"> <span style="float:left;font-size:80%;">左端</span> <span style="float:right;font-size:150%;">右端</span> </div> float を指定しなければ下端は揃っているのですが、 float をつけると下端ではなく上端が揃います。

    • ベストアンサー
    • CSS
  • document.body.innerHTML.replaceでハイライトさせた文字を戻す方法

    document.body.innerHTML=document.body.innerHTML.replace(/検索した文字/g,'<span style=background-color:yellow>検索した文字</span>');focus(); で検索文字を黄色くさせたあと、更新させない限り元に戻りません。これでは、他の文字を検索したときに、前に検索した文字が黄色くなりっぱなしで、不便です。どうしたらよいでしょうか?

  • 写真と文字の大きさをそろえたい

    ビルダーを使いながらやっているのですが 二つのものを左右に並べて上下同じ大きさで表示したいのですが、 下記では同じ大きさになっていると思うのですが、 大きさが(上下の大きさのみ※左右は異なってよいのですが) ことなって表示されてしまいます。 解決方法を教えてください。。。 <DIV style="width : 191px;height : 335px;top : 94px;left : 157px; position : absolute; z-index : 10;" id="Layer8" class="hpb-lb-tb1-cell1" align="center"> <SPAN class="hpb-body4"><SPAN STYLE="line-height:1"><span style="font-size:15pt"> <B><STRONG>ここに文字</STRONG></B></SPAN></SPAN></SPAN> </DIV> <DIV style="width : 412px;height : 295px;top : 94px;left : 347px; position : absolute; z-index : 9; " id="Layer9" class="hpb-lb-tb1-cell2" align=""><IMG src="hpb_i_top10.jpg" alt="イメージ" width="412" height="295"></DIV>

  • IEでのみfloatが効かない?

    WEBサイトのレイアウトを、以下のように書いているのですが IE(ver.8~10)のみ思ったように表示されません。 具体的には・・・ <div style="float:left; "> <span>ダミーテキストAAA</span> </div> <div style="float:left; "> <span>ダミーテキストAAA</span> </div> <div style="float:left; "> <span>ダミーテキストAAA</span> </div> ただdivを縦に並べたいだけなのですが、 上のコードを例にすると三番目のdivが縦に並ばず 二番目のdivの右横に来てしまいます。 この現象はIEでだけで、他のブラウザ (safari、google chrome、Firefox)では正しく表示されます。 解決方法をご存知の方がいらっしゃいましたら、ご教示願います。 情報の過不足等ありましたらご指示ください。

  • 一部の文字列の右寄せについて

    以下の例のとおり文字列の横に赤と書き赤の文字だけを装飾し右寄せします。 これはテーブルの中に書いているのですが、文字列が長くセル内で折り返し2行で 表示された際に赤の文字は3行目に右寄せされてしまいます。 これを2行目に表示させることはできないでそうか。 よろしくお願い致します。 .right { text-align:right; } .aka { background-color:#FF0000; } あいうえおかきくけこ<DIV CLASS="right"><SPAN CLASS="aka">赤</SPAN></DIV>