返回与标签名称查询匹配的数组中的html标签名称

Question

在给定标签查询的情况下，我试图返回所有HTML标签，仅按返回标签的标签名称，然后将其打印到控制台。但是，我将返回一个标签名称数组，但所有的html行也是如此。

例如，给定以下HTML标记：

<div></div>
<div id="backgroundred" class="blackfont center>

我希望能够返回[div, div]的数组，但是我不是用[div, div#backgroundred.blackfont.center]返回。使用下面的JS代码，如何仅返回数组中的标签名称？

let tagQuery = "div";
let sss = [];
let tagMatch = document.getElementsByTagName(CSS.escape(tag));
sss.push(tagMatch);
console.log(sss);

我知道querySelector可以做到这一点，但是我很好奇使用其他方法来做到这一点。因此，请不要回答querySelector

Answer 1

您可以改用Array.from，并传递第二个参数以将每个元素仅映射到其标签名称：

const tagNames = Array.from(
  document.getElementsByTagName('div'),
  element => element.tagName.toLowerCase()
);
console.log(tagNames);

<div></div>
<div id="backgroundred" class="blackfont center"></div>

仍然，当您已经知道您正在选择div标签时，提取标签名称有点奇怪，您可以只检查集合的长度，然后{{ 1}}数组，如果需要的话

.fill

const tagName = 'div';
const tagNames = new Array(document.getElementsByTagName(tagName).length).fill(tagName);
console.log(tagNames);