用 jQuery 添加新的 LI 后如何“刷新”UL？答案

【问题标题】：how to "refresh" UL after adding new LI with jQuery?用 jQuery 添加新的 LI 后如何“刷新”UL？
【发布时间】：2012-03-23 04:01:36
【问题描述】：

我认为它类似于this question，但我的问题是关于 jQuery 和 HTML5。我正在向<UL> 添加一个<LI> 元素，并在其中添加链接（<a href="..">）作为纯文本，不可点击。除此之外，图像不可见，而<img src=".."> 元素正在被正确添加。

看起来我在使用append() 后需要一些“刷新”技巧。哪一个？

这是我的代码，以防万一：

$('ul').append($('<li/>').append($('<img/>').attr('src', 'http://example.com')));

图像不可见，而 HTML 正在正确构建。我正在 Mac 上尝试 Safari 5.1。

顺便说一句，在 Firefox 10.0 中一切正常。也许实际的问题是我在 Safari 中使用 XML+XSL 格式，在 Firefox 中使用纯 HTML5 ..

【问题讨论】：

不是 100% 确定 append 是如何工作的，但在我看来，您将图像附加到 li 之外（直接在 ul 下）。并且 attr 不需要属性名称（如 src）？你能检查生成的 DOM 吗？
我刚刚更正了我的示例。生成的 DOM 看起来完全正确。
这是 jQuery 手机吗？如果是这样，您确实需要某种刷新。
不，它不是 jQuery mobile，只是 Mac 上 Safari 中的 jquery 1.7.2
错误控制台中的任何内容？

【解决方案1】：

这就是它的工作方式（另请参阅this question）：

$('#list').html('<li>foo</li>');

【讨论】：

【解决方案2】：

这将添加一个带有图像的 li 元素。

   $("ul").append("<li><img src='http://www.yourimage/normal.JPG' /> </li>");

【讨论】：