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

Question

是否有一种原生 Javascript 方法来获取元素 insideHTML 及其自己的 html？如何获取包含所选元素本身的完整 html 字符串？

希望这是有道理的。这个例子展示了一种 JQuery 方法来完成我想要的事情，所以希望这清楚地解释了我想要做的事情:http://jquery-howto.blogspot.com/2009/02/how-to-get-full-html-string-including.html

事情没有这么简单吧？

var allHTML = myEle.outerHTML + myEle.innerHTML;

Answer 1

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

一个简单的 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 年左右以来，它所依赖的浏览器功能已在所有常见浏览器中可用。