html方法中的根元素

Question

在jQuery .html()方法中，某种方式不会返回根元素，例如：

var test = $('<root><val>hello world</val></root>');
var str = test.html(); // '<val>hello world</val>'

如何获得包含根标签的字符串？

Answer 1

您需要outerHTML属性。 Firefox不支持它，因此您需要包含修复：

var str = test[0].outerHTML || $('<div>').append(test).html();

工作示例： http://jsfiddle.net/Ub244/

Answer 2

因为test IS <root>元素。你正在创建并选择它。

html()将返回所选元素的innerHTML，在本例中为<root>

---

您要找的是outerHtml。

请参阅此问题：Get selected element's outer HTML

---

你可以从jQuery对象获取root，然后像这样调用get it的外部html：

test.get(0).outerHTML;

工作示例：http://jsfiddle.net/U7Zdc/

Answer 3

这是预期的功能。 .html（）的文档说明：

  

获取匹配元素集中第一个元素的HTML内容。

因此，变量test是指向<root>元素的jQuery对象。在其上调用.html（）将在元素中返回HTML 。它与使用普通JavaScript的 innerHTML 属性相同。

要获得<root>，您需要将test与另一个元素包装起来并获取其内容： $('<div>').append(test.clone()).remove().html();