获取包含属性的开始标记 - 没有innerHTML的outerHTML

Question

我想从DOM中检索某个带有其属性的标记元素。例如，来自

<a href="#" class="class">
  link text
</a>

我想得到<a href="#" class="class">，可选择关闭</a>，作为字符串或其他对象。在我看来，这类似于在没有.outerHTML的情况下检索.innerHTML。

最后，我需要通过jQuery包装其他一些元素。我试过了

var elem = $('#some-element').get(0);
$('#some-other-element').wrap(elem);

但.get()返回DOM元素，包括其内容。也

var elem = $('#some-element').get(0);
$('#some-other-element').wrap(elem.tagName).parent().attr(elem.attributes);

失败，因为elem.attributes返回NamedNodeMap，这与jQuery的attr()不兼容，我无法转换它。承认上面的例子不是很有意义，因为它们还复制了元素的不再唯一ID。但有什么简单的方法吗？非常感谢。

Answer 1

var wrapper = $('.class').clone().attr('id','').empty();

• 您可能希望更改选择器以更精确地匹配您正在寻找的<a>元素。
• clone()创建匹配元素的新副本，也可以选择复制事件处理程序。
• 我使用attr来清除元素的ID，这样我们就不会重复ID。
• qazxsw poi删除所有子节点（'qazxsw poi'）。

Answer 2

对于未来的Google员工，有一种方法可以在没有jQuery的情况下执行此操作：

empty()

由于innerHTML包含开头标记，后跟tag = elem.outerHTML.slice(0, elem.outerHTML.indexOf(elem.innerHTML)); 包含的镜像，我们可以将outerHTML从0（开始标记的开头）子串到innerHTML开始的位置（开始标记的结尾），并且因为innerHTML是outerHTML的镜像。 ，除了开头标签，只剩下开口标签！

这个适用于outerHTML标签，innerHTML标签和其他空标签：

<br>

因为innerHTML在自闭标签中是空的，并且<meta>总是返回0，所以上述修改首先检查tag = elem.innerHTML ? elem.outerHTML.slice(0,elem.outerHTML.indexOf(elem.innerHTML)) : elem.outerHTML; 的存在。

Answer 3

这是我的解决方案：

indexOf('')

我想，那个紧密标签的形式是：innerHTML。

Answer 4

不幸的是，正如我在opentag=elem.outerHTML.slice(0, elem.outerHTML.length-elem.innerHTML.length-elem.tagName.length-3); 所说的那样，"</"+elem.tagName+">"并不可靠。感谢@AaronGillion's answer。我推荐a comment稍加改动以支持@sus：

his/her way

代码在Typescript中。如果你想要纯Javascript，删除类型（qazxsw poi和qazxsw poi）。