2017-05-08 22 views
1

pタグのIDが特定のIDと等しくないdivタグと内容をすべて取得する必要があるサンプルの複数行の文字列があるJavascript [ s S] *が欲張りすぎる

var str="<div> 
     <p id=\"a\">Sample sentence</p> 
     </div> 

     <div> 
     <p id=\"b\">Sample sentence 2</p> 
     </div>" 

私が使用していた正規表現はあまりにも貪欲で、2番目のdivタグとその内容に一致する必要がありますが、上からdivタグもキャプチャしています。ここに私の正規表現は次のとおりです。

<div>[\s\S]*<p id="b">[\s\S]*<\/div> 

私はそれが文字列全体をキャプチャされて使用されるが、私はちょうどキャプチャする正規表現のために:

<div> 
    <p id="b">Sample sentence 2</p> 
</div> 

これで私を助けることができるそこに任意の正規表現の第一人者を?

+3

例えば、あなたはブラウザ/ Node.jsの範囲内であれば、これは簡単です、DOMパーサを使用しますhttp://stackoverflow.com/questions/10585029/parse-a-html-string-with-js他の多くの例がここにあります。 –

+3

Regexp gurusはregexpでDOMを解析/解析/操作しようとしないようお勧めします。例えば、ネストされたdivの存在下で正しく動作するregexpを書くことは理論的に不可能です。 –

+0

タグは正規表現で解析できます。しかし、タグ間のオープン/クローズや不足、構造的関係は、正規表現の特権ではありません。 – sln

答えて

1

多くの人が助言するでしょう:don't use HTMLを解釈/解析/抽出するための正規表現。代わりに、DOMの機能を使用します。たとえば:あなたはこのような場合には正規表現を使用する必要がある場合

var str=` 
 
<div> 
 
    <p id="a">Sample sentence</p> 
 
</div> 
 

 
<div> 
 
    <p id="b">Sample sentence 2</p> 
 
</div>`; 
 

 
var elem = document.createElement('span'); 
 
elem.innerHTML = str; 
 
elem = elem.querySelector('div:nth-child(2)'); 
 
console.log(elem.outerHTML);

1

あなたは/<div>\n.*<p id=\\"b\\">.*\n.*<\/div>/gを試すことができます。私はあなたができる場合は、DOMパーサーを使用するように提案します。

const regex = /<div>\n.*<p id=\\"b\\">.*\n.*<\/div>/g; 
 
const str = `<div> 
 
     <p id=\\"a\\">Sample sentence</p> 
 
     </div> 
 

 
     <div> 
 
\t \t \t <p id=\\"b\\">Sample sentence 2</p> 
 
     </div>`; 
 
let m; 
 

 
while ((m = regex.exec(str)) !== null) { 
 
    // This is necessary to avoid infinite loops with zero-width matches 
 
    if (m.index === regex.lastIndex) { 
 
     regex.lastIndex++; 
 
    } 
 
    
 
    // The result can be accessed through the `m`-variable. 
 
    m.forEach((match, groupIndex) => { 
 
     console.log(`Found match, group ${groupIndex}: ${match}`); 
 
    }); 
 
}

関連する問題