我抓取各种jquery对象放入数组,然后以HTML格式吐出。
我正在尝试将jQuery对象转换为文本字符串,以便以后可以将其作为HTML吐出。
我现在正在使用这种技术:
console.log($myObject.clone().wrap('<div></div>').html());
但是,这似乎只是抓住我对象的内容。
例如,如果$ myObject为<h2>My Title</h2>
,则上面只返回“我的标题”(没有H2标签)。
我也尝试使用.text()但得到相同的结果。
有没有办法将整个jQuery对象转换为文本字符串?
答案 0 :(得分:5)
好吧,回答我自己的问题。
console.log($('<div>').append($myObject.clone()).remove().html());
感谢John Feminella在这个帖子中:
How do you convert a jQuery object into a string?
谁参考了这篇文章:
http://jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html
答案 1 :(得分:1)
您所关注的不是将JQuery对象转换为字符串,而是将DOM节点转换为HTML表示。
JQuery中没有内置方法来执行此操作,Javascript中也没有任何相似内容。
这有点繁琐,但你可以重建它。 下面的代码不完整也没有经过测试,但这里的想法是
var h = '';
$('#my_selector').each(function(){
h += '<' + this.NodeName;
for(var k in this.attributes){
h += ' ' + this.attributes[k].nodeName + '="' + this.attributes[k].value + '" ';
}
h += '>';
h += this.innerHTML;
h += '</' + this.NodeName + '>';
});
答案 2 :(得分:1)
从您的示例中,您是否只需要使用调用$ myObject.html()?
然而,既然我猜你所追求的可能不仅仅是那个,那么将对象转换为JSON还能完成这项工作吗?
有几个jQuery插件可以做到这一点。我用过的那个对我来说一直很好用的,似乎不再有了,但你可以在这里得到它
http://jollytoad.googlepages.com/json.js
搜索jQuery插件库可以将这两个作为替代方案
http://plugins.jquery.com/project/JSONEncoder
http://plugins.jquery.com/project/LABSJSON
我从未尝试过他们中的任何一个,所以不能保证他们的效率
答案 3 :(得分:1)
console.log($('<div></div>').append($myObject.clone()).html());
答案 4 :(得分:0)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#btnCreateNewDiv').click(function () {
$('#result').append($('<div></div>').append($('#testClone').clone()).html());
$('#result div:last').show();
});
});
</script>
<style type="text/css">
.Clone
{
background-color: Red;
}
.Clone h1
{
color: Lime;
}
</style>
</head>
<body>
<input type="button" value="Create New Div" id="btnCreateNewDiv" />
<span id="result"></span>
<div id="testClone" class="Clone" style="display: none;">
<h1>
test
</h1>
</div>
</body>
</html>