Javascript 从没有内部文本内容的元素中获取html标记

使用Javascript我希望获取一个DOM元素，只获取它的标记、类、id，等等（括号中的内容），但忽略其中的实际文本内容。有点像

innerHTML

/

textContent

的反面

所以我希望能得到这样一个节目：

Ipsum-Lorem

将以下内容转换为字符串：

---

将
outerHTML
中的
innerHTML
替换为空，或者像我在这里所做的那样，用省略号“…”：

选择元素（
getElementById（“foo”）
）后

Ipsum-Lorem

这将把
字符串
返回到
var txt

…
使用或如果您不想使用：

获取节点名并将元素属性缩减为字符串

'use strict';

const elem = document.getElementById('foobar');
const nodeName = elem.nodeName.toLowerCase();
const attrs = [...el.attributes].map((a) => {
  if (a.value === '')
    return a.name;
  else if (a.value.indexOf('"') > -1)
    return `${a.name}='${a.value}'`;
  else
    return `${a.name}="${a.value}"`;
}).join(' ');
const str = `<${nodeName} ${attrs}></${nodeName}>`;

“严格使用”；
const elem=document.getElementById（'foobar'）；
const nodeName=elem.nodeName.toLowerCase（）；
常量属性=[…el.attributes].map（（a）=>{
如果（a.value==''）
返回a.name；
else if（a.value.indexOf（“”）>-1）
返回`${a.name}='${a.value}`；
其他的
返回`${a.name}=“${a.value}`；
}).加入（“”）；
常量str=`；

@Jamesonthedog:这没什么错，但是作为一个通用的解决方案，答案是痛苦的。太多不必要的DOM元素序列化是一个不必要的搜索。当然，那里只有两个节点，但在一般情况下，这将是相当大的杀伤力。你可以通过执行
elem.cl来克隆没有内容的节点oneNode（）
。那么你所需要的就是
.outerHTML
。我不知道你是否真的想要新的内容……而且，我很确定在某些情况下，这可能会产生意想不到的结果。将nodename和concat属性作为字符串你说的“take”是什么意思“他们？你们真的需要HTML标签格式的结果吗？我的意思是在括号内得到一个HTML字符串。若你们只需要括号内的内容，那个么它就不是真正的标签了。使用Daniel的答案，可以分别获得属性键和值。因此，最好的解决方案取决于您最终将如何处理数据。正如你所知道的，你永远不会得到原始的HTML。它需要从DOM节点重新创建，因此可能不完全相同。您只是重新实现了
elem.cloneNode（）.outerHTML
。小心包含双引号字符的属性值。不知道
.cloneNode
…但属性可以包含双引号？我从来都不知道。是的，如果它使用单引号作为值分隔符，你的代码仍然可以工作，但是结果中的属性值的格式会不正确。这比只使用cloneNode（）好吗？@JonSG可能不知道，我不知道这个方法
'use strict';

const elem = document.getElementById('foobar');
const nodeName = elem.nodeName.toLowerCase();
const attrs = [...el.attributes].map((a) => {
  if (a.value === '')
    return a.name;
  else if (a.value.indexOf('"') > -1)
    return `${a.name}='${a.value}'`;
  else
    return `${a.name}="${a.value}"`;
}).join(' ');
const str = `<${nodeName} ${attrs}></${nodeName}>`;