JSタグの中身を正規表現で取得したい

Question

■検索対象文字列

<div> 一行目 </div> <div> 二行目 </div>

上記の様な文字列から、一行目（タグの中身）のみ抽出する正規表現を教えてください。
/<div>[\s\S]*</div>/i
では二行目まで抽出されてしまいます。

よろしくお願い致します。

Answer 1

最短マッチさせれば良いので
/<div>[\s\S]*?<\/div>/i
で良いのではないでしょうか？

Comments

[退会済みユーザー]

解決しました。ありがとうございます。

Answer 2

こういう場合に正規表現は使いませんが、一つ目の div 要素ノードを得る事は可能です。

document.querySelector('div').firstChild.data

ただ、一つ目の div 要素ノードを得る仕組みにすると構成を変更するだけで機能しなくなるので、現実的には class や id 属性を付与して参照しやすいようにマークアップします。

(2015/11/17 23:46追記)

検索対象はstringでdomではありません。

div要素の配下に要素がないのなら、下記正規表現でマッチできます。

/<div>([^<]*)/.exec('<div>一行目</div><div>二行目</div>');

ただし、複雑な DOM なら空の div 要素ノードに innerHTML で挿入して DOM 操作する方が無難です。

Comments

[退会済みユーザー]

回答ありがとうございます。検索対象はstringでdomではありません。domへの変換などは行わず正規表現でマッチる方法を探しています。

[think49]

親コメントに追記しました。

Answer 3

タグの中身のみですか

/(?:<div>)[^(<\/div>)]*?(?=<\/div>)/

(?:)は非キャプチャリング、真ん中は</div>が現れないまで最小マッチ、3つ目の塊は肯定先読みです。
実行してないのでバグが有るかもしれませんが＾＾；（てかあるきがする）

Comments

[退会済みユーザー]

/<div .*?>([\s\S]*?)<\/div>/i

最終的にはこうなりました。
回答ありがとうございます

[think49]

To: pasuwardoさん
(?:<div>) は <div> と等価です(キャプチャリングはしませんが、消費します)。
[^(<\/div>)] は文字クラスなので「"d", "i", "v" ...etc」以外の文字にマッチします。
pasuwardo さんが書きたかったであろう正規表現は次のようになります。
/<div>((?:(?!<\/div>)[\s\S])*)/.exec('<div>一行目</div><div>二行目</div>')[1]; // "一行目"
これは最短一致と違ってバックトラックしない点で優秀ですが、<div> が入れ子になっていた場合に破綻します。
/<div>((?:(?!<\/div>)[\s\S])*)/.exec('<div><div><strong>一行目</strong></div></div><div>二行目</div>')[1]; // "<div><strong>一行目</strong>"
なので、他のタグが含まれる場合を考慮するなら innerHTML で DOM 化して textContent や innerHTML で期待する文字列を得るのが良いと思いましたが、最短一致をベストアンサーにしたところを見るに <div> は入れ子ではなかったのかもしれません。

[退会済みユーザー]

＞[^(<\/div>)] は文字クラスなので「"d", "i", "v" ...etc」以外の文字にマッチします。
確かによく考えたらそうですね
あと入れ子のことも忘れてました。
手元に実行環境が無かったので脳内で考えてやったらボロボロになってしまいました。
指摘ありがとうございます。