`appendTo()` 在哪里可以与`htmlString` 一起使用？

Question

appendTo 的 API 文档列出了能够为目标选择 HTML 字符串的方法。

但是，这似乎没有用，因为该集合仍然包含原始元素，并且 HTML 字符串似乎没有被添加到 DOM 中的任何地方，我也没有看到可以使用它的情况。

var b = button.appendTo('<div>').appendTo('body');

b 是一个按钮，但它没有包裹在 div 或任何东西中。

你可以在http://jsfiddle.net/0dgLe5sj/看到这个

附加到 HTML 字符串（页面上尚不存在）在哪里有用？

Answer 1

appendTo() 返回被附加的项目。

所以你的代码是：

var btn = button.appendTo('<div>');
btn.appendTo('body');

如你所见，你将它移动到一个 div 中，然后立即将它移动到 body 中。所以当你最后看它时，它就在体内。

也许你的意思是：

var b = button.appendTo($('<div>').appendTo('body'));

这会将div 附加到正文，然后将 btn 附加到该 div。

更新小提琴：http://jsfiddle.net/0dgLe5sj/8/

或者，如果您想先添加到 div：

var b = button.appendTo("<div>");
b.parent().appendTo("body")

但如果将其组合成一行，则无法使用 .appendTo 将按钮返回到变量中，因为您将 div 添加到正文中，因此您将获得 div 或身体回来了。

---

要解决“这在哪里有用”：

能够创建 分离的 DOM 元素对于解析 HTML 字符串非常有用，也可以用于“批量”一些更改，而不会强制页面重绘。

将一个按钮移动到一个分离的 div 并返回到 body 没有太多意义，但它证明了原则。