我有以下 html:
<body>
<div>
<img id ="img1" src="http://aboveandbeyondkm.com/wp-content/uploads/2013/11/Angry-Birds-HD-Wallpaper.png" style="width:100px; height:100px;"/>
</div>
</body>
以及以下 JavaScript:
var array1 = [];
array1[0] = $('#img1');
var ndiv = "<div style='border: 2px solid red;'>" + array1[0] + "</div>";
$('body').append(ndiv);
这是我想要实现的目标的淡化版本,但这是我遇到困难的基础。
当我附加 ndiv 时,它不会附加图像,因为它是一个对象。我尝试了 jquery text()、html() 和 parseHTML 方法,但没有成功。
任何帮助将不胜感激。
我做了一个jsfiddle:
谢谢
更新
我想感谢大家的及时回复。 Guffa根据我提供的内容正确回答了问题。但我的代码并不像我呈现的那么简单。 Eman Z 的答案是最容易融入我的代码流程中的。希望我可以选择两个答案。
这是我正在做的事情的一个例子。只是为了提供背景。有一个论坛,其中有一个叫做主题的东西。每个主题都有标题、评论。 View 和缩略图。每个主题可以有多个缩略图。为了查看缩略图以预览主题,必须单击按钮。所以我希望缩略图能够自动显示而无需点击。所以我所做的是创建一个书签,其中有一个 iframe,用于加载缩略图所在的页面。我将所有这些信息保存到一个数组中。因此,您在 jsfiddle 中看到的示例可能看起来像是我正在拍摄图像并将其放入另一个数组中,但我不想编写所有代码来获取图像,因此为了简单起见,我选择以这种方式显示它。
最佳答案
以下是您想要实现的目标的要点:
var nDiv = jQuery('<div />').append($('#img1'));
$('body').append(nDiv);
如果你想使用字符串方法,你可以使用:
$('#img1')[0].outerHTML
这将为您提供 html 字符串。
关于jquery将html转换为字符串并转换为html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24110101/