如何使用 jQuery 获取元素的外部 html？

在使用jQuery时，我们经常需要获取元素的外部html，例如想要获取一个div元素及其包含的所有子元素的html。下面介绍两种获取元素外部html的方式。

1. 使用 .html() 方法

jQuery提供了 .html() 方法，该方法可以获取或设置元素内部的html。通过结合 .prop() 方法，我们可以获取元素的外部html。

var outerHtml = $("<div>").append($("#element").clone()).html();
console.log(outerHtml);

上面的代码中，我们首先创建一个 div 元素，将要获取的元素克隆一份并添加到新创建的 div 元素内部，然后使用 .html() 方法获取新创建的 div 元素的html，即可得到元素的外部html。

2. 使用 .wrap() 方法

除了使用 .html() 外，jQuery还提供了 .wrap() 方法。该方法可以将一个元素包裹在另一个元素中。通过将要获取的元素包裹在一个新创建的 div 元素内，然后再获取该 div 元素的html，即可得到元素的外部html。

var outerHtml = $("#element").wrap("<div>").parent().html();
console.log(outerHtml);

上面的代码中，我们使用 .wrap() 方法将要获取的元素包裹在一个新创建的 div 元素中，然后使用 .parent() 方法获取该 div 元素的父级元素，即可得到元素的外部html。

总结

以上介绍了使用 jQuery 获取元素的外部html的两种方式：使用 .html() 方法和使用 .wrap() 方法。两种方法各有优缺点，开发者可以根据具体应用场景进行选择。