forEach 里面的 forEach 有条件吗？

Question

我有两个列表，我想检查列表 B 是否包含列表 A 中的项目，因此我创建了一个按钮来触发 forEach 以检查列表 B 的任何元素的 innerText 是否与列表 A 中的元素相似：

    let itemsFromA = document.querySelectorAll('.itemA')
    let listB = document.getElementById('listB')

    listB.childNodes.forEach(childNodes => {
        if (childNodes.innerText === itemsFromA.forEach(itemsFromA => itemsFromA.innerText)) {
            childNodes.style.display = 'none'
        }
    })
}

但什么也没有发生。 我怎样才能解决这个问题？

谢谢

Answer 1

NodeList.forEach()不返回任何内容（或始终返回undefined ）。 使用Array.from()将itemsFromA转换为数组，并使用Array.some()检查是否有任何项目具有相同的innerText ：

let itemsFromA = document.querySelectorAll('.itemA')
let listB = document.getElementById('listB')

listB.childNodes.forEach(node => {
  if (Array.from(itemsFromA).some(itemsFromA => itemsFromA.innerText === node.innerTex)) {
    node.style.display = 'none'
  }
})

Answer 2

您可以使用some而不是forEach （它不返回任何内容，因此您的代码不起作用..）。

有些人会测试数组中的至少一个元素是否通过了提供的 function 实现的测试。

let itemsFromA = document.querySelectorAll('.itemA')
let listB = document.getElementById('listB')

new_list = listB.childNodes.map((index, childNodes) => {
    if (itemsFromA.some(item => item.innerText === childNodes.innerText)) {
        childNodes.style.display = 'none'
    }
})

Answer 3

这是因为forEach循环不返回值。 使用 map 而不是 forEach 来获得预期的行为。

例如：

if (childNodes.innerText === itemsFromA.map(itemsFromA => itemsFromA.innerText))

Answer 4

试试这个方法：

  let itemsFromA = document.querySelectorAll('.itemA')
  let listB = document.getElementById('listB')

  list = listB.childNodes.map((index, childNodes) => {
      itemsFromA.forEach(itemsFromA => {
        if (childNodes.innerText === itemsFromA.innerText)
           childNodes.style.display = 'none'
      })
    })
}

Answer 5

forEach 不返回任何值，它只会循环遍历数组。 你应该改用 find function

`让 itemsFromA = document.querySelectorAll('.itemA') 让 listB = document.getElementById('listB')

listB.childNodes.forEach(childNode => {
    if (itemsFromA.find(itemsFromA => itemsFromA.innerText == childNode.innerText)) {
        childNodes.style.display = 'none'
    }
})

}`