如何使用jQuery .append()函数添加图片？

Question

我可以将一个字符串附加到我的表格中，以显示状态。

$('#test').empty().append("on")

但如果我能显示一张图片而不是一个字符串会更好。我尝试了以下代码：

$('#test').empty().append(<img src="/static/on.png" height="64px" width="64px">)

但是它没有起作用。我该怎么办？

- yvonnezoe

---

整个<img />标签需要放在引号中。$.append('<img src="..." />') - matthewpavkov

Answer 1

引号缺失：

$('#test').empty().append('<img src="/static/on.png" height="64px" width="64px">');

由于您正在清空并添加项，因此您可以改为使用此方法。.html会用图像项替换选择器的整个内容。稍后，如果您想要将内容附加到此div中，则可以使用.append(...);

$('#test').html('<img src="/static/on.png" height="64px" width="64px">');

如果您计划清空并添加图像，则 .html() 是最适合您的方法。

查看 .html() 的参考文献

- PSL

---

它仍然需要引号。以及美元符号。 :) - Ry-

@PSL，你能帮我看一下这个问题吗？ :) http://stackoverflow.com/questions/16411085/how-to-set-setinterval-period-as-variable-and-to-remove-waiting-time - yvonnezoe

Answer 2

尝试

$('<img />', {
    src: 'test.png',
    width: '200px',
    height: '100px'
}).appendTo($('#empty').empty())

- Arun P Johny

---

再次感谢你，Arun！你能帮我看看这个问题吗？http://stackoverflow.com/questions/16411085/how-to-set-setinterval-period-as-variable-and-to-remove-waiting-time :) - yvonnezoe

使用这段代码，img标签将会拥有style="width:200px; height:100px"属性。 - Ol Sen

我需要添加样式背景图片，但它无法进入样式参数。 $('<li />', { background-image: 'url("'+tweet.photoUrl+'")', width: '134px', height: '134px' }).appendTo($('.tweets'));`无法理解background-image。 - omarojo

Answer 3

您需要在要添加的HTML周围加上引号：

$('#test').empty().append('<img src="/static/on.png" height="64px" width="64px">');

我在这里使用单引号是因为HTML中已经有双引号，如果你用双引号包围它，它们会转义字符串。

- Elliot Bonneville