如何使用jquery获取子标记和父标记的html字符串？

Question

例如,如果我有HTML ul列表

<ul id="ulIdentificator"> 
    <li id="li0"></li>
    <li id="li1"></li>
    <li id="li2"><label id="label1"></label></li>   
</ul>

如果我像这样使用jQuery

var htmlStr = $("#li2").html();

结果将只是包含label标签的字符串<LABEL id="label1"></LABEL></li>我需要获取包含此内容的Html字符串<LI id="li2"><LABEL id="label1"></LABEL></LI>

Answer 1

Andres提到的第二个OuterHTML技术(来自Web Architects的博客)适用于所有浏览器,因此它可能是更好的选择.基本思想是你可以通过使元素的innerHTML成为另一个元素来获得元素的外部HTML:

var outerHtml = $("<div/>").append($("#li2").clone()).html();

只有一个稍微棘手的位 - 确保clone你的原始元素,所以你不要从DOM中删除它.

如果你经常这样做或想要对元素数组执行此操作,那么可能值得关注链接的示例并制作一个小插件来执行此操作.