将 jquery DOM 转换为 html答案

【问题标题】：Coverting jquery DOM to html将 jquery DOM 转换为 html
【发布时间】：2016-06-09 10:32:36
【问题描述】：

我有以下 jQuery DOM：

var markup = $("<a></a>").addClass("ClassName")
            .attr({ href : "Something.html",title : "Edit"});

我想将上面的 jQuery DOM(markup variable) 转换为 html 。如何做到这一点？

【问题讨论】：

如果我理解正确，你想要这个吗？

标签： javascript jquery html datatables

【解决方案1】：

获取 outerHTML dom 元素的属性

var markup = $("<a></a>").addClass("ClassName")
  .attr({
    href: "Something.html",
    title: "Edit"
  });

console.log(
  markup[0].outerHTML
)

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

或者用一个元素包裹，使用html()方法获取html内容。

var markup = $("<a></a>").addClass("ClassName")
  .attr({
    href: "Something.html",
    title: "Edit"
  });

console.log(
  $('<div/>', {
    html: markup
  }).html()
)

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

你只是颠倒了你的 sn-ps 顺序 :) 顺便说一句，恕我直言，使用markup.prop('outerHTML') 更一致，但在这里真的没关系
sn-p for html wrapper 就在您使用outerHTML 的语句下方，反之
感谢解决方案有效。但是为什么我们需要指定索引[0]？
@user2713255 : 要从 jQuery 对象中获取 dom 元素，outerHTML 是 dom 元素的属性。您也可以按照 A.Wolf 的建议使用 markup.prop('outerHTML')

【解决方案2】：

要获取 HTML，您可以在另一个对象中 wrap() 它，然后从中检索 html()：

var $markup = $("<a></a>", {
    'class': 'ClassName',
    'href': 'Something.html',
    'title': 'Edit'
});
var html = $markup.wrap('<div />').parent().html();

或者，您可以检索底层 DOMElement 的 outerHTML 属性：

var html = $markup[0].outerHTML;

也仅供参考，该术语是“jQuery 对象”。页面上只有一个 DOM。

【讨论】：