Question

我正在尝试将DIV与值55的复选框匹配。但我得到所有DIV，包括正确的DIV。

如何让它变得非贪婪？

body.innerHTML.match(/(<div*?)([\s\S]*?)(value="55"?)([\s\S]*?)<\/div>?/)[0]

<div class="hidden" data-sort="0"> 
  <input type="checkbox" value="52">one
</div>
<div class="" data-sort="1"> 
  <input type="checkbox" value="53">two
</div>
<div class="" data-sort="2"> 
  <input type="checkbox" value="55">three
</div>
<div class="" data-sort="3"> 
  <input type="checkbox" value="56">four
</div>

Answer 1

如果您将数据作为字符串并且只需使用普通JS，则可以使用以下正则表达式：

<div\b((?:(?!<\/?div\b)[\s\S])*?value=["']?55\b["']?[\s\S]*?)<\/div>

请参阅demo。

var re = /<div\b((?:(?!<\/?div\b)[\s\S])*?value=["']?55\b["']?[\s\S]*?)<\/div>/g; 
var str = '<div class="hidden" data-sort="0"> \n  <input type="checkbox" value="52">one\n</div>\n<div class="" data-sort="1"> \n  <input type="checkbox" value="53">two\n</div>\n<div class="" data-sort="2"> \n  <input type="checkbox" value="55">three\n</div>\n<div class="" data-sort="3"> \n  <input type="checkbox" value="56">four\n</div>';
 
if ((m = re.exec(str)) !== null) {
    
    document.getElementById("res").value = m[0];
}

<input id="res" size="70"/>

Answer 2

要定位div元素（DOMNode），您可以这样查询：

var el = document.querySelector('input[value="55"]').parentNode;

如果您想获得完整的HTML代码，则可以获取outerHTML

var html = el.outerHTML; // <div class="" data-sort="2">.....</div>

Answer 3

如果你不仅限于使用jQuery，这是一个解决方案，

$('input[value="55"]').parent()

查找具有特定内容的DIV标签

3 个答案: