Question

在jQuery Infinite Carousel中，它使用.clone()来实现无限效果。除非它克隆的代码具有HTML5元素，否则这很有用。 IE7和IE8无法将HTML5元素特定的CSS规则应用于克隆或以后页面加载插入的元素。

innerShiv JavaScript插件以IE7和IE8将使用适当的CSS呈现的方式插入元素。

问题是innerShiv将HTML字符串作为参数，但jQuery .clone（）方法返回一个jQuery对象数组。

为了将两者结合使用，我需要将.clone（）的输出转换为innerShiv能够解析的HTML字符串。

有关如何做到这一点的任何想法？

Answer 1

HTML：

<p class="foo"><canvas class="bar"></canvas></p>

JavaScript：^[Ref]

// grab the object, with HTML 5 element(s).
var p = $('p');

// clone it
var c = p.clone();

// grab the inner html (wrap it so we can get the HTML)
var html = $('<div>').append(c).html();

// alert us of the contents
alert(html);

演示：

http://jsfiddle.net/bradchristie/tDFYn/

Answer 2

使用.clone().html();，它会将对象转换为字符串。看看：http://jsfiddle.net/9k2LS/

-edit -

重新考虑：确实是@Jazzerus，为什么要使用.clone（）？没有clone（）的.html（）会做。

Answer 3

var html = $.parseHTML(yourHtmlString); //Returns an Array of HTML Objects

//some operations on html like $(html).find() ...

html  = $('<div>').append(html).html();  // Returns string (string of html)
console.log(html);

如何将jQuery对象数组转换为HTML字符串

3 个答案: