Question

我想获取html，包括我用来获取html的选择器

让我说我有

<div id="foo">
  <div id="bar">content</div>
</div>

当我$('#foo').html()时，我得到了

<div id="bar">content</div>

在jquery中是否有一种方法可以获得整个html，包括父（选择器div）

我想要这整个HTML

<div id="foo">
  <div id="bar">content</div>
</div>

Answer 1

你可以这样做：

$('#foo')[0].outerHTML;

DEMO

更多信息：

https://developer.mozilla.org/en/DOM/element.outerHTML

Answer 2

您也可以使用.clone()和.wrap()

来执行此操作

$('#foo').clone().wrap("<div/>").parent().html();

演示： http://jsfiddle.net/joycse06/Vy5JW/

firefox outerHTML不支持

注意 < 11.0您可以在浏览器兼容性部分https://developer.mozilla.org/en/DOM/element.outerHTML

中查看

因此，对于故障安全，您可以使用以下内容，如果可用，可以利用outerHTML并在浏览器中使用

$foo = $('#foo');
var outerHtml =   ('outerHTML' in $foo[0])? $foo[0].outerHTML 
                                  : $foo.clone().wrap("<div/>").parent().html();

更新了演示 http://jsfiddle.net/joycse06/Vy5JW/1/

Answer 3

您可以使用the outerHTML property：

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

Answer 4

除了Sarfraz的回答，如果您使用的是jQuery，可以将其打包到自己的插件中：

(function($) {

    $.fn.outer = function() {

        return $(this)[0].outerHTML;

    };

})(jQuery);

以下是演示：http://jsfiddle.net/WkH4z/

Answer 5

试试这个：

    $('#foo').parent().html();

获取完整的HTML而不仅仅是innerhtml

5 个答案:

DEMO