从 HTML 字符串中提取 DOM 节点，结果为 HTML 字符串答案

【问题标题】：Extract DOM Node from HTML String, Result as HTML String从 HTML 字符串中提取 DOM 节点，结果为 HTML 字符串
【发布时间】：2013-02-12 12:55:23
【问题描述】：

给定

var html = "<html><body><p>Hello, World!</p><p>Ciao!</p></body></html>";

我想提取body标签(Hello, World!Ciao!)的内部HTML。

.find() 找到 body DOM 节点

var body = $(html).find("body");

但我找不到获取该节点内部 HTML 的方法。我试过了：

var text = body.text(); //  returns ""
var var = body.var(); // returns undefined

如何获得<body> 标记的内部 HTML 的字符串表示形式？

【问题讨论】：

$(html).find("body").html(); ?
@aroth: 那也是undefined。
那么我相信这就是为什么它不起作用的解释：stackoverflow.com/questions/2488839/…。这是demo；在 Chrome 中，除了两个  标记外，所有内容都被删除了。

标签： jquery

【解决方案1】：

您可以使用子字符串，获取的索引和索引，并用里面的内容创建一个子字符串。

var bot = html.indexOf("<body>");
var top= html.indexOf("</body>");
var body=html.substring(bot,top);

【讨论】：

【解决方案2】：

当您将字符串包装在$() 中时，jQuery 将去除html 和body 标签。

因此你可以这样做：

var str=$('<div>').append($(html)).html()

演示http://jsfiddle.net/LxdrM/

【讨论】：

正确，但它似乎不是 jQuery 正在做的。见stackoverflow.com/questions/2488839/…

【解决方案3】：

你可以试试body[0].innerHTML()

【讨论】：

var body = $(html).find("body");将返回一个元素数组。使用 body[0] 获取元素并在其上调用 innerHTML 函数。

【解决方案4】：

由于您要显示字符串表示形式，因此最好将 html 保留在 div 元素（或 body 标记内的任何其他元素）中，而不是 body 标记本身。对于字符串表示，请使用TextArea，这也是 SO 正在使用的。

Working fiddle

$(function(){
   var body = $('html').find('div'); 
   var text = body.html(); 
   $("#textArea").val(text);
});

HTML

<html>
     <body>
        <div><p>Hello, World!</p>
             <p>Ciao!</p>
        </div>
        <textarea id="textArea" name="post-text" cols="92" rows="15" tabindex="101">
        </textarea>
     </body>    
 </html>

【讨论】：

不幸的是，我无法控制 HTML 片段。它没有包含正文中其余标签的单个标签。