javascript – 为什么获取外部HTML不起作用?

前端之家收集整理的这篇文章主要介绍了javascript – 为什么获取外部HTML不起作用?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我尝试以两种不同的方式获取外部 HTML,基于 this question.不幸的是,它们都没有给出预期的结果:

HTML:

<div id='my_div'>Hello</div>

JS:

$(function() {
    document.write('[' + $('#my_div').clone().wrapAll("<div />").parent().get(0).innerHTML + ']<br />');
    document.write('[' + (new XMLSerializer().serializeToString(document.getElementById('my_div'))) + ']');
});

输出是:

[
Hello
]
[
Hello
]

我希望得到以下结果:< div id ='my_div'> Hello< / div>

Live example here

我究竟做错了什么 ?

解决方法

首先,你的第一个例子工作正常.看一下 Firebug中的输出.注意,由于输出是HTML,因此它呈现为HTML.请注意,在HELLO之前和之后都有新行……………因为HELLO在DIV内部!

看一看:

第二个w / jQuery,你也可以使用the method in my answer to the question you linked to

var outerHTML =  $('<div>').append( $("#my_div").clone() ).html();

jsFiddle example

这会将有问题的元素的克隆附加到DIV jQuery对象,并获取DIV jQuery对象的内部HTML ….这是所讨论元素的outerHTML.

元素的outerHTML的一般形式是:

$('<div>').append( $(ElementSelector).clone() ).html();

其中ElementSelector是您想要的outerHTML元素的jQuery选择器.

注意:上面没有为DOM添加新元素. $(‘< div>‘)……永远不会添加到DOM中.它仍然只是独立于DOM的jQuery对象.

猜你在找的JavaScript相关文章