Javascriptを

Question

に1つのタグタイプを持つ文字列を置換するための正規表現私はspanタグ（他のHTMLタグ、単純なテキスト）と文字列であってもよい<span style="[^"]+">.*?</span>タグの前と後、間のすべての文字列を置換するに 私はこのような正規表現を持つ。 .+?、.*?、代わりにを：

'<span>foo</span><span style="text-decoration:underline;">bar</span><span>baz</span>' 

私も使ってみてください。この文字列

'foo<span style="text-decoration:underline;">bar</span>baz' 

ため

var span_re = /^(.+)(?=<span)|(?=<\/span>)(.+)(?=<span)|(?=<\/span>)(.+)$/g; 
str = str.replace(span_re, '<span>$1</span>'); 

は、私はこれが欲しい

'<span>foo</span><span style="text-decoration:underline;">bar<span></span>' 

を得ましたは結果のない完全な式をキャプチャします。

私はパーサーは必要ありません。私はXHTMLを解析せず、自己完結型のタグを持っていません。

Answer 1

解析HTMLは、ほとんどのWebブラウザのコンテキストで良いアイデア、特殊ではありません。ここではjQueryを使用して、あなたが望むものを取得する簡単な例です：

そのHTMLがDOMの内側になっていない場合でも、ダミー要素でラップするのは簡単です：ボーナスとして

var wrapper = $('<div />') 
wrapper.html('foo<span style="text-decoration:underline;">bar</span>baz'); 
wrapper.contents() 
    .filter(
     function(){return this.nodeType == 3;} //select text nodes only 
    ) 
    .wrap('<span />'); 

他のタグでもうまく動作し、フリーテキストのとの間に<span>タグが複数ある場合でも、それらはの間にあります。

実施例：[XHTMLの自己完結型のタグを除いて正規表現一致オープンタグ]のhttp://jsbin.com/acigu5/

Answer 2

あなたはそれを複雑にしているかもしれません。

が

s = s.replace(/^[^<]+|[^>]+$/gi, '<span>$&</span>'); 

この正規表現は（ない<、最初から）タグの前にテキストを検索しますか：あなたは、単一の<span>、ない他のタグなしエスケープ>兆候を有していてもよくわかっている場合は、この単純な正規表現を使用することができますタグの後（>ではなく、最後まで）、<span>でラップします。 $& JavaScript regex replaceは、マッチ全体またはグループ0（他のフレーバーの場合は\0または$0）を表します。

元の正規表現の(?=<\/span>)は先読みで、ルック・バックではありません（JavaScriptには裏返しがありません）。その結果、(.+)が終了タグと一致し、それを消費し、無効なHTMLが発生しました。例の作業

：正規表現を使用してhttp://jsbin.com/acexu4/