javascript - 快速解决 DOM 中 JQuery .remove() 前导空格的方法？

Question

我正在使用 JQuery 的 .append() 和 .remove() 函数在 div 中添加和删除变量。

所以当东西在里面时，div 看起来有点像这样:

<div id="list">
    <a>var1</a>
    <a>var2</a>
    <a>var3</a>
</div>

问题是当我对 div 中的某些内容使用 .remove() 时，它会在 DOM 中留下一个空间。所以它看起来像这样:

var1

var3

我明白为什么会发生这种情况，但是有没有一种简单的方法可以使用另一个 JQuery 函数来解决这个问题，在我使用 .remove() 之后可能会像这样输出 div:

var1
var3

还是我需要做一些更复杂的事情？

Answer 1

因为您的元素实际上被包围在包含换行符的文本节点中，就像您的 html 所说的那样。如果你不相信我:http://tinker.io/7f667/1

\n<a>var1</a>\n<a>var2</a>\n<a>var3</a>\n

您不会在显示中注意到它们，因为 html(通常)不区分空格。

如果你想删除周围的换行符，然后告诉 DOM 删除它们:http://tinker.io/7f667/2

//assuming `list` is your container, and `toRemove` is the element to be removed
list.removeChild(toRemove.previousSibling);
list.removeChild(toRemove.nextSibling);
list.removeChild(toRemove);

如果您愿意，将其转换为 jquery 代码应该很简单。请注意周围的文本节点不是元素。