JavaScript：如何获取 <div> 的子名称

Question

我有一个类似这样的结构：<div class="tower">    <div class="E0">abc</div>    <div class="GU">123</di</div>没有我的问题是我想在javascript中获取内部类名'E0'和'GU'，而我只知道外部类名'tower'。因此，虽然“塔”保持不变，但“EO”和“GU”可能是其他名称，我希望拥有类名（作为字符串）。感谢您的帮助（很抱歉这个可能很愚蠢的问题）

Answer 1

您可以使用children父节点的属性，然后使用数组.map()方法遍历它们中的每一个以获取类名，例如：

const children = document.querySelector('.tower').children;

const classes = [...children].map(el => el.className)

console.log(  classes )

<div class="tower">

    <div class="E0">abc</div>

    <div class="GU">123</di

</div>

Answer 2

像这样的东西？

let clss = [...document.querySelector(".tower").querySelectorAll("div")]

    .map(div => [...div.classList.values()].map(val => val))

console.log(clss)

<div class="tower">

    <div class="E0 B0">abc</div>

    <div class="GU">123</div>

</div>

Answer 3

var first = document.querySelector(".tower div:first-child").className;
var last = document.querySelector(".tower div:last-child").className;