javascript - 选择h2标签的前两个单词并包裹在span标签中

我想在页面上找到所有h2标签，然后将前两个单词包装在span标签中。我已经检查了this stackoverflow question，但是它没有帮助我。

我能够按照此链接进行操作，并且dd跨度到前2个单词，但是唯一的问题是，如果我在h2标签内有html，例如我在h2标签内有超链接。

任何人都可以帮助我如何制作此代码，以便忽略html并仅考虑前两个单词吗？

任何帮助都非常感谢！



我的小提琴：

JSFiddle



我的JS：

jQuery(document).ready(function($){
    jQuery('h2').html(function (i, html) {
        return html.replace(/(\w+\s\w+)/, '<span>$1</span>')
    });
});

我的HTML：

<h2>
    <a title="test post 2" href="#">
        test text dolor sit enum
    </a>
</h2>
<h2>lorem ipsum dolor sit enum</h2>

最佳答案

这应该为您工作。

jQuery(document).ready(function($){
  jQuery('h2').html(function (i, html) {
    if(/<[a-z][\s\S]*>/i.test(html)) {
      html = jQuery.parseHTML(html);
      return html[0].innerHTML.replace(/(\w+\s\w+)/, '<span>$1</span>');
    }
    return html.replace(/(\w+\s\w+)/, '<span>$1</span>');
  });

});

h2 {
  color:#f2f2f2;
}
h2 span {
  color:blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2><a title="test post 2" href="#">test text dolor sit enum</a></h2>
<h2>lorem ipsum dolor sit enum</h2>