web-dev-qa-db-ja.com

JavaScriptでHTMLタグを文字列から削除する方法

重複している可能性があります:
テキストJavaScriptからHTMLを削除

JavaScriptで文字列からHTMLを削除する方法

163
f.ardelian

現在のブラウザではおそらくブラウザのパーサを使用するのが最善の策です。以下は注意して、以下のように動作します。

  • あなたのHTMLは<div>要素の中で有効です。 <body>タグ、<html>タグ、または<head>タグ内に含まれるHTMLは、<div>内では無効であるため、正しく解析されない可能性があります。
  • textContent(DOM標準プロパティー)とinnerText(非標準)プロパティーは同一ではありません 。たとえば、textContentには<script>要素内のテキストが含まれますが、innerTextには含まれません(ほとんどのブラウザで)。これはIE <= 8にのみ影響します。これはtextContentをサポートしない唯一の主要なブラウザです。
  • HTMLは<script>要素を含みません。
  • HTMLはnullではありません
  • HTMLは信頼できる情報源から来ています。これを任意のHTMLで使用すると、信頼できない任意のJavaScriptを実行することができます。この例は、重複質問に対するMike Samuelのコメントからのものです:<img onerror='alert(\"could run arbitrary JS here\")' src=bogus>

コード:

var html = "<p>Some HTML</p>";
var div = document.createElement("div");
div.innerHTML = html;
var text = div.textContent || div.innerText || "";
213
Tim Down
cleanText = strInputCode.replace(/<\/?[^>]+(>|$)/g, "");

このWebサイト(web.archive) から抽出。

255
ReactiveRaven
var html = "<p>Hello, <b>World</b>";
var div = document.createElement("div");
div.innerHTML = html;
alert(div.innerText); // Hello, World

これは、ほぼ最高の方法です。HTMLを解析することで、ブラウザに最高の効果を発揮させることができます。


編集:以下のコメントで述べたように、これは最もクロスブラウザのソリューションではありません。最もクロスブラウザの解決策は、要素のすべての子を再帰的に調べて、見つかったすべてのテキストノードを連結することです。しかし、あなたがjQueryを使っているなら、それはすでにあなたのためにそれをしています:

alert($("<p>Hello, <b>World</b></p>").text());

text メソッドをチェックしてください。

43
Felix

私はこの質問が受け入れられた答えを持っていることを知っています、しかし私はそれがすべての場合にうまくいくとは限らないと感じます。

完全を期すために、そして私はこれに時間をかけ過ぎたので、ここに私たちがしたことがあります:私たちは php.js からの関数を使用することになりました。 PHPに精通しているだけでなく、時々JavaScriptを少しだけやっています。

http://phpjs.org/functions/strip_tags:535

これは、私が自分のアプリケーションに入力したさまざまな種類の入力をすべてうまく処理した唯一のJavaScriptコードのようです。それは、それを壊すことなく、上の<script />タグについての私のコメントを見てください。

25
Till