javascript - 附加重复的 javascript 对象

Question

在下面的代码中，我正在 JS 中开发一个简单的计时器。问题是生成的代码只显示一组分隔符冒号。

var divider = $('<span>').addClass('divider').text(':');
stopwatchFace = stopwatchFace.append(timeHour).append(divider)
                             .append(timeMin).append(divider).append(timeSec);

第一个没有被捡起来有什么原因吗？我应该明确定义一个divider1 和一个divider2 对象吗？

Answer 1

如果附加一个已经附加的元素，结果是它被移动了。

您需要克隆元素。在 vanilla JS 中，这就像divider.cloneNode(true).
在 jQuery 中也很简单：divider.clone(). 感谢博阿斯提供的信息^_^

Answer 2

使用需要克隆分隔线。由于分隔符是 dom 单个元素，不能同时存在两个地方。

var divider = $('<span>').addClass('divider').text(':');
stopwatchFace = stopwatchFace.append(timeHour).append(divider.clone())
                             .append(timeMin).append(divider).append(timeSec);