javascript - 正则表达式与 jQuery text() 方法相结合

Question

$(document).ready(function(){
   var regex1 = $('#element').text().match(/\b(06\d{8})\b/g);
   console.log('regex1: ' + regex1);
  
   var regex2 = $('#element').text().match(/(06\d{8})/g); 
   console.log('regex2: ' + regex2);
   
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id = "element">
 0600000000
    0600000001
    <div>0600000002</div> 0600000003
    TEST:0600000004
    <span>0600000005</span><span>TEST0600000006</span><span>0600</span><span>000007</span>
  
</div>

我们想要的只是 6 个匹配项 0600000000-0600000005。当我使用这个正则表达式时看起来很棒: /\b(06\d{8})\b/g https://regex101.com/r/fE6gJ7/1

但是..，当我使用 jQuery text() 时，text() 的输出似乎将每个 HTML 标记替换为“nothing”:

输出$(element).text()

 0600000000
    0600000001
    0600000002 0600000003
    TEST:0600000004
    0600000005TEST06000000060600000007

有可能避免这种情况吗？或者我可以用一个空格替换每个 HTML 标签吗？或者替代方案是什么(迭代所有文本元素？)

Answer 1

使用.html()插入.text()。 .text() 将删除元素内的 HTML 标签，并且 textContent 将与其他文本连接起来。

因此，在父元素上使用 text() 进行跟踪

<span>0600000005</span><span>TEST0600000006</span><span>0600</span><span>000007</span>

会给

0600000005TEST06000000060600000007

由于单词边界，正则表达式不会在这里捕获任何内容。

演示:

$(document).ready(function(){
   var regex1 = $('#element').html().match(/\b(06\d{8})\b/g);
   console.log('regex1: ' + regex1);
  
   var regex2 = $('#element').html().match(/(06\d{8})/g); 
   console.log('regex2: ' + regex2);
   
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id = "element">
 0600000000
    0600000001
    <div>0600000002</div> 0600000003
    TEST:0600000004
    <span>0600000005</span><span>TEST0600000006</span><span>0600</span><span>000007</span>
  
</div>