jquery将html转换为字符串并转换为html

标签 jquery html

我有以下 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:

jsfiddle example

谢谢

更新

我想感谢大家的及时回复。 Guffa根据我提供的内容正确回答了问题。但我的代码并不像我呈现的那么简单。 Eman Z 的答案是最容易融入我的代码流程中的。希望我可以选择两个答案。

这是我正在做的事情的一个例子。只是为了提供背景。有一个论坛,其中有一个叫做主题的东西。每个主题都有标题、评论。 View 和缩略图。每个主题可以有多个缩略图。为了查看缩略图以预览主题,必须单击按钮。所以我希望缩略图能够自动显示而无需点击。所以我所做的是创建一个书签,其中有一个 iframe,用于加载缩略图所在的页面。我将所有这些信息保存到一个数组中。因此,您在 jsfiddle 中看到的示例可能看起来像是我正在拍摄图像并将其放入另一个数组中,但我不想编写所有代码来获取图像,因此为了简单起见,我选择以这种方式显示它。

jsfiddle solution

最佳答案

以下是您想要实现的目标的要点:

    var nDiv = jQuery('<div />').append($('#img1'));
    $('body').append(nDiv);

如果你想使用字符串方法,你可以使用:

    $('#img1')[0].outerHTML

这将为您提供 html 字符串。

就像这样:http://jsfiddle.net/VttM4/3/

关于jquery将html转换为字符串并转换为html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24110101/

相关文章:

html - 即使使用 'background-repeat: no-repeat' 也会重复背景图像

javascript - 使用 JavaScript 迭代 JSON 数组中的对象

javascript - jQuery slideToggle 回调函数和 toggleclass

javascript - 从 JavaScript 渲染 HTML 数组中的每个对象

html - 导航子菜单 - 如果窗口太窄则显示在左侧

html - 如何只调用一次谷歌字体

javascript - jquery 下拉菜单不起作用

javascript - 在以宽度为百分比创建后获取 d3.js SVG 元素的像素宽度

javascript - 从动态表单生成创建 JSON

Javascript 文件未运行