使用 jQuery 获取自己的 HTML 代码 [重复]答案

【问题标题】：get self HTML code with jQuery [duplicate]使用 jQuery 获取自己的 HTML 代码 [重复]
【发布时间】：2012-01-28 13:47:52
【问题描述】：

<div>
  <a href="#" class="selected">link1</a>  
  <a href="#">link1</a>
</div>

并使用以下

$('.selected').html()我明白了

link1

作为返回值。

如何获取所选DOM元素的完整html代码，在本例中获取

<a href="#" class="selected">link1</a>

改为？

谢谢

【问题讨论】：

标签： jquery

【解决方案1】：

jQuery 对象：

$('.selected')

成为DOM对象：

$('.selected')[0]

更新：

var str = $("<div />").append($('.selected').clone()).html();
console.log(str);

【讨论】：

【解决方案2】：

我知道这可以在 Chrome 上运行，其余的不知道：

$("#yourElement")[0].outerHTML

该属性来自 javascript（不是 jQuery），并为您提供所需的内容。

【讨论】：

Mozilla 表示它现在可以从 Firefox 11 开始工作：developer.mozilla.org/en-US/docs/Web/API/Element.outerHTML
适用于 FireFox 47、IE11、Opera 38

【解决方案3】：

我做了一个与上面类似的解决方案，但没有克隆。

var test = $('#test').wrap('<div class="wrap-unwrap"></div>');
var str = test.parent().html();
test.unwrap();
console.log(str);

【讨论】：

【解决方案4】：

仅使用outerHTML 属性可能无法在所有浏览器中使用。对于不支持outerHTML 的浏览器，您需要自己对其进行序列化。解释见此贴：How do I do OuterHTML in firefox?

【讨论】：

【解决方案5】：

你可以试试这个 jQuery 插件：http://darlesson.com/jquery/outerhtml/

【讨论】：