Javascript 如何构建比节点列表大的数组，将空字符串作为缺少类的占位符？

HTML

现在，如果节点中没有div class=“3”，那么对于每个不携带class=“3”div的元素，节点列表长度将减少1

---

当前输出为

未为class3list定义innerText

，因为class3list的长度比class2List短。

使用可选链接，以便值

未定义

，如果元素不存在，则在这种情况下使用

？？

替换为空字符串：

[{class2: 'element1class2', class3: 'element1class3'},
 {class2: 'element2class2', class3: ''} ]

如果无法使用可选链接，则可以使用条件运算符：

class3: class3list[i]?.innerText ?? '',

如果您需要在中间处理“空洞”，则使用不同的方法：映射<代码>（{ class2:class2.textContent， class3:class2.nextElementSibling？.textContent？？“” })); console.log（节点）

元素1类2
元素1类3
元素2类2

多亏了@certainperformance，我找到了解决问题的方法，使用分组选择器（class1），然后将每个数组元素映射到我要查找的类（class2或class3）的另一个querySelector 例如：

class3: class3list[i] ? class3list[i].innerText : '',

感谢对class=2的css选择器的提示

const nodes = [...document.querySelectorAll('[class="2"]')] 

---

通过这种方式，我们可以检查节点列表中每个父节点的父节点下是否存在类。

问题是class2list看起来像[1,2,3,4,5]，class3list看起来像[1,3,5]（基于父节点）两个节点列表的长度不相等，并且在使用QuerySelector时，没有与节点关联的相对父节点。我想根据父类将刮取的数据与正确的组进行匹配。可能最好在问题中显示一个有漏洞的示例。请参见编辑，导航到相邻同级

class3: class3list[i] ? class3list[i].innerText : '',

const nodes = [...document.querySelectorAll('[class="2"]')] 

nodes.map(node => ({
    class2: node.querySelector('[class="2"]') ? node.querySelector('[class="2"]').textContent: '',
    class3: node.querySelector('[class="3"]') ? node.querySelector('[class="3"]').textContent: ''
}))