Question

如何使用jQuery在标题的最后一个单词周围添加span元素。

我想要这样的输出：

<div class="hedererty">
  <h1>Lorem ipsum dolor sit amet, consectetuer adipiscing <span>elit</span></h1>
</div>

注意：这是示例标题。在我的网站中，标题会随着不同的页面而变化。

有任何想法或建议吗？感谢。

Answer 1

尝试

$('.hedererty h1').html(function(idx, html){
    return html.replace(/(\w+)$/, '<span>$1</span>')
})

演示：Fiddle

或

$('.hedererty h1').html(function (idx, html) {
    return html.replace(/(\s[\S]+)$/, '<span>$1</span>')
})

演示：Fiddle

Answer 2

split()字符串，将span添加到弹出的字符串，并使用join()

连接字符串

$(".hedererty h1").html(function(){
    var mystring= $(this).text().split(" "); //Split the string
    var lastword = mystring.pop(); //Pop the last index value
    return mystring.join(" ")+ (mystring.length > 0 ? " <span>"+ lastword + "</span>" : lastword); 
    //Return concatenated string
});

Demo

如何在世界各地添加span元素

2 个答案: