淡入附加元素[重复]

Question

我将 DOM 附加到某个间隔中的某个元素，我希望它淡入，但似乎它首先出现，然后消失，然后才运行淡入。

var el = document.getElementById('cont');
el.innerHTML = '';
var toAppend = getElementsToAppend();
$(el).hide().append(toAppend).fadeIn(300);

我应该如何顺利地做到这一点？

Answer 1

首先，您似乎混合了原生 JS 和 jQuery 方法。我建议尽可能多地坚持其中一个。另请注意，您是在 $(el) 上调用 fadeIn()，而不是在附加到 DOM 的内容上。

假设 elementsToAppend() 返回一个 DOMElements 数组，您可以将它们全部放在一个 jQuery 选择器中，然后在附加后调用 fadeIn() 之前对它们调用 hide()。试试这个：

var $toAppend = $(getElementsToAppend()).hide();
$('#cont').empty().append($toAppend);
$toAppend.fadeIn(300);