如何使用jQuery .append（）附加图像？

Question

我可以在表格中添加一个字符串来显示状态

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

但如果我能显示图像而不是字符串会更好。我试过这个：

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

但它不起作用。我该怎么办？

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">');

如果您计划empty并附加图片，则.html()是您的最佳选择。

See Ref for .html()

Answer 2

尝试

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

Answer 3

您需要将要包含引号的HTML包围起来：

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

我在这里使用了单引号，因为你已经在HTML中使用了双引号，所以如果你使用双引号将它们包围起来，它们就会转义字符串。