Javascript 如何获取包含所选元素本身的完整html字符串？

是否有一种本地Javascript方法可以获取html及其自身html中的元素？如何获取包含所选元素本身的完整html字符串

希望这是有道理的。这个例子展示了一种JQuery方法来实现我想要的功能，希望这能清楚地解释我要做的事情：

不是这么简单吧

var allHTML = myEle.outerHTML + myEle.innerHTML;

---

您只需要

outerHTML

本身，而不是

innerHTML

：

myEle.outerHTML

请注意，Firefox目前（2011年12月）不支持这一点，它可能会破坏交易。参见第页的支持矩阵。不过，它将在即将发布的Firefox版本中得到支持。请参阅上的错误报告

Chrome、Safari、IE和Opera都支持它

---

如果需要通用支持，请参阅。这个问题的公认答案包括一个后备例程。

我想您应该使用

元素.outerHTML

。查看如何以跨浏览器方式执行此操作。

这将有助于您将此功能添加到项目的某个位置：

Node.prototype.getHTML = function() {
    var wrap = document.createElement("div");
    var cthis = this.clone();
    wrap.appendChild(cthis);
    return wrap.innerHTML;
}

然后你可以打电话

var allHtml = myEle.getHTML();

---

helper函数将节点临时包装在一个div中，因此当它调用innerHTML时，它将获取原始元素的所有元素，它也应该是跨浏览器安全的，它是我的工具箱的一部分，我倾向于用于我的所有项目

最合适的跨浏览器方法是使用最广泛支持的功能，避免扩展DOM原型之类的事情（因为浏览器不需要实现它们，而一些非常常见的浏览器不需要），并在适当的情况下使用合适的功能测试

一个简单的getOuterHTML函数是：

function getOuterHTML(el) {
  var d;

  if (typeof el.outerHTML == 'string') {
    return el.outerHTML;

  } else {
    d = document.createElement('div');
    d.appendChild(el.cloneNode(true));
    return d.innerHTML;
  }
}

---

它所依赖的浏览器功能从2000年左右开始在所有常用浏览器中可用。

是的，没错，Chrome、Safari、IE、Opera。但不是Firefox。Firefox最终在2001年提交，所以它应该很快就会出现。@RightSaidFred不管怎样，仍然会有不支持它的浏览器在使用，所以功能测试和回退是明智的。@RobG:你完全正确。我只是指出FF终于上船了。但是，人们需要一段时间才能升级。另一方面，我认为FF用户倾向于非常积极地升级。如果它是你工具箱的一部分，你会想要更新它<代码>wrap.appendChild（此）将从DOM中删除元素，并将其放置在新的

div

中。您需要对元素进行

.clone（）

以防止出现这种情况。注意，我使用此函数处理的元素从一开始就不在dom中（从字符串创建），敬请注意。