node.js - 使用 querySelectorAll，如何在某些情况下捕获属性，在其他情况下如何捕获整个元素？

Question

使用 Node 并有类似的东西:

const carsforsale = Array.from(document.querySelectorAll(div > p, div > a, div> div > h1))
return carsforsale.map(elem => elem.innerText)

假设我想从 <p> 捕获 innerText和 <h1>但不是来自 <a> ，因为我只想要 <a> 中的 href 属性并且在使用 map 函数时也会返回 innerText，用不必要的信息填充数组。

有没有一种简单的方法可以在查询选择器函数上执行此操作？

或者甚至是在 map 功能上做这件事的简单方法？

Answer 1

请注意 Array.from 接受第二个参数，这是一个映射器函数 - 只要您有一个 Array.from 后跟一个 .map，您可以将其压缩为单个 Array.from。

在映射器函数中，您只需要检查您正在迭代的元素的 tagName:

return Array.from(
  document.querySelectorAll('div > p, div > a, div> div > h1'),
  elem => (
    elem.tagName === 'A' ? elem.href : elem.innerText
  )
);

另请注意，当您使用字符串时，它们需要包含在分隔符中，例如 '、" 或 `。(document.querySelectorAll(div > p, div > a, div> div > h1) 将导致 SyntaxError)

旁注，您可能想要textContent 而不是innerText。 innerText 是 quirky, harder to use大多数情况下 textContent 的版本。