javascript - 如何在第一个标签之前包装所有文本

Question

我在一个元素中有文本内容h1，我想将第一个元素之前的所有内容包装br成span.

这是我的开始：

<h1 class="my-heading">lorem ipsum<br />dolor sit amet<br />lorem ipsum dolor<br />sit amet</h1>

这就是我想要结束的内容：

<h1 class="my-heading"><span class="my-wrapper">lorem ipsum</span><br />dolor sit amet<br />lorem ipsum dolor<br />sit amet</h1>

Answer 1

从 Arun P Johny 建议的代码开始，我想出了这个，如果你的页面中有几个 h1，它也可以工作：

jQuery('.my-heading').each(function (){
    jQuery(jQuery(this).prop('firstChild')).wrap('<span>');
});

为我做。谢谢你帮助我！

Answer 2

一种方法是

var $heading = $('.my-heading'),
    $contents = $heading.contents(),
    index = $contents.index($heading.children('br').first());
$contents.slice(0, index).wrapAll('<span>');

演示：小提琴

---

但是如果在之前没有任何其他元素br（即您只需要包装第一个文本节点），那么

$($('.my-heading').prop('firstChild')).wrap('<span>')

演示：小提琴