如何删除h1标签的一部分并在其他地方使用它，使h1保持不变

Question

我有以下标签：

<h1><span>FOO</span> Rest of my title</h1>

我想检索“我的书名中的其余部分”，以将其附加到其他地方（无跨度）；而且，我希望h1保持不变（不删除跨度）。

到目前为止，我正在做的是：

var h1 = $("h1");
var result = $(h1).find("span").remove().end().text();
alert(result);

=>会变成

<h1><span>FOO</span> Rest of my title</h1>

进入

<h1>Rest of my title</h1>

我认为我正在修改H1，而不是检索其值以进行进一步的操作。

我如何实现我想要的？

Answer 1

您非常亲密。我建议在.clone()之后链接一个$(h1)，以便您不要操纵页面上的项目，而要操纵它的临时副本。

var h1 = $("h1");
var result = $(h1).clone().find("span").remove().end().text();
console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1><span>FOO</span> Rest of my title</h1>

Answer 2

只需克隆h1对象并完成工作

var h1 = $("h1").clone();
var result = $(h1).find("span").remove().end().text();
alert(result);