jquery - 隐藏/显示元素还是附加元素更好？

Question

哪一种是首选方法，为什么？

方法一：

<p>When I'm clicked, add an image under me.</p>
<img src="/path/to/image.gif" />

$('p').hide(); // OR css display:none
$('p').click(function() {
    $('img').show();
});

方法二：

<p>When I'm clicked, add an image under me.</p>

$('p').click(function() {
    $('<img src="/path/to/image.gif" />').appendTo('p');
});

Answer 1

在这种精确的情况下，第一个解决方案似乎更好，因为它使浏览器能够在用户点击之前很久就开始加载图像。

当您没有那么大的行为差异时，我建议保留解决方案，使您能够拥有最干净和最简单的代码。这将取决于您可以向我们展示的更多代码。

即使在那里，如果第二种解决方案与框架更加一致，或者由于其他原因几乎可以确保您的图像在缓存中，则第二种解决方案可能会更好。