jquery - 如何在第一个 jquery 方法之后获取 outerHTML？

Question

任何人都知道如何从这一点获取外层HTML？....

  $("#sectionA tr[data-testlog='"+variableName+"']").first().outerHTML;

返回一个未定义的....

Answer 1

outerHTML是一个 DOM 属性，因此您首先必须访问包装在 jQuery 对象中的 DOM 元素

您可以使用each

$(/*any jquery stuff*/).each(function(idx, domEl) {
    console.log(domEl.outerHTML);
});

如果您知道您只有一个匹配项，或者只想获得第一个元素，您应该这样做：

$(SELECTOR)[0].outerHTML // or access any other **DOM** property

在你的情况下：

$("#sectionA tr[data-testlog='"+variableName+"']")[0].outerHTML 
// first() would be redundant and unnecessary

基本上，您可以将 jquery 对象视为围绕 DOM 元素数组的包装器，它添加了使开发人员满意的大量功能，并且功能跨浏览器兼容。

根据MDN ， outerHTML 支持：

Firefox (Gecko): 11    since 2012-03-13
Chrome: 0.2            since 2008-09-02
Internet Explorer 4.0  since 1997
Opera 7                since 2003-01-28
Safari 1.3             since 2006-01-12

或者正如akluth建议的另一个问题，你可以

// select your element
$(SELECTOR)
// clone it (outside the dom of the page)
.clone()
// wrap it in another element
.wrap('<div>')
// get the parent - basically the wrapper you just added
.parent()
// and get its inner html - all the html your SELECTOR initially selected
.html();

// all in one line
$(SELECTOR).clone().wrap('<div>').parent().html();

这将是一个由 jQuery 完成的更昂贵的操作，但也将是一个跨浏览器的解决方案。outerHTML可能（或可能不）在所有浏览器/平台上得到同等支持。