从没有内部文本内容

Question

使用 Javascript 我希望采用DOM元素，只需标记，类， id 等等（括号中的内容），但忽略其中的实际文本内容。有点像innerHTML / textContent的反面。

所以我希望得到这样的div：

<p id="foo">Ipsum Lorem</p>

成一个字符串：

<p id="foo"> </p>

Answer 1

使用.cloneNode或者如果您不想使用它：

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

'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}>`;

https://jsfiddle.net/k22tyqbr/3/

Answer 2

将innerHTML内的outerHTML替换为任何内容，或者像我在此处所做的那样，省略“......”：

var txt = elem.outerHTML.replace(elem.innerHTML, '...');

选择元素（getElementById("foo")）后，

<p id="foo">Ipsum Lorem</p>

这会将string返回var txt

<p id="foo">...</p>