在JQuery中获取Node的原始HTML

我用$("#parent").html()来获取#parent的内部html，但是如何获取父本身的html？

用例是，我抓住这样的输入节点：

 var field = $('input'); 

我希望能够获得该节点的原始html（ ）与field.html() ，但返回空。 这可能吗？

Answer 1

或者您可以创建添加如下的JQuery函数：

 jQuery.fn.outerHTML = function(s) { return (s) ? this.before(s).remove() : jQuery("
").append(this.eq(0).clone()).html(); } 

所以你可以这样做：

 $('input').outerHTML(); 

要么

 $('input').outerHTML("new html"); 

感谢http://yelotofu.com/2008/08/jquery-outerhtml/

Answer 2

做起来有点尴尬：

 var field = $("input"); // assuming there is but 1 var html = field.wrap("
").parent().html(); field.unwrap(); 

html()与innerHTML类似。 没有“标准” outerHTML方法。 上面将你想要的元素包装在一个临时元素中并获取它的innerHTML 。

Answer 3

这个问题很老，但现在有一个简单的解决方案：

 var html = $('input').prop('outerHTML'); 

html示例字符串值：

摆弄它：
https://jsfiddle.net/u0a1zkL1/3

并且，Optimae评论中提到的技术也有效：

 var html = $('input')[0].outerHTML; 

Answer 4

您可以使用：

 var html = $('#parent')[0]; 

这将获得#parent节点，然后返回返回的第一个节点的代码（在这种情况下将是唯一的代码）。