jquery将html转换为字符串和html

I have the following 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>

and the following javascript:

和以下javascript：

var array1 = [];
array1[0] = $('#img1');

var ndiv = "<div style='border: 2px solid red;'>" + array1[0] + "</div>";
$('body').append(ndiv);

This is a waterdown version of what I'm trying to achieve but that's the basis of what I'm having difficulties with.

这是我想要实现的水的版本，但这是我遇到困难的基础。

When I append ndiv it doesn't append the image because it's an object. I tried jquery text(), html() and parseHTML methods with no luck.

当我附加ndiv时，它不会附加图像，因为它是一个对象。我试过没有运气的jquery text（），html（）和parseHTML方法。

Any help would be greatly appreciated.

任何帮助将不胜感激。

I made a jsfiddle:

我做了一个jsfiddle：

jsfiddle example

jsfiddle的例子

Thanks

谢谢

Update

更新

I wanted to thank everyone for their prompt reply. Guffa answered the question correctly based on what I provided. But my code wasn't as simple as I presented it. Eman Z answer was the easiest to incorporate into the flow of my code. Wish I could choose two answers.

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

Here's an example of what I'm doing. Just to give a background. There's a forum that has something called topics. Each topic have a title, comments. views and thumbnails. Each topic can have several thumbnails. In order to see the thumbnails to get a preview of the topic one would have to do click on a button. So I wanted the thumbnails to show up automatically without clicking. So what I did was create a bookmarklet which has an iframe which loads the page that the thumbnails are in. I save all this info to an array. So the example you see in the jsfiddle may seem like I'm taking images and putting it into another array but I didn't want to write all the code to get the images so I chose to show it this way for simplicity.

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

jsfiddle solution

jsfiddle解决方案

6 个解决方案

#1

Here's the gist of what you're trying to achieve:

以下是您要实现的目标：

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

If you want to use the string method you can use:

如果要使用字符串方法，可以使用：

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

This will give you the html string.

这将为您提供html字符串。

Just like this: http://jsfiddle.net/VttM4/3/

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

6 个解决方案

#1

更多相关文章

随机推荐