遍历段落数组并在JavaScript中添加来自另一个数组的内容

我有3个想要动态更改的

元素。 我有数组中这些段落的值

这是我的HTML：

<p class="para">text xxx</p>
<p class="para">text yyy</p>
<p class="para">text zzz</p>

我如何做到这一点？

类似的事情

if (window.matchMedia("(max-width: 567px)")) {
  const paraText = [
    'text for mobile xxx',
    'text for mobile yyy',
    'text for mobile zzz'
  ];

  document.querySelectorAll('.para')
    .forEach((p, i) => p.innerText = paraText[i]);
}

---

querySelectorAll

返回的是

NodeList

而不是数组，因此不具有

map

功能

此外，

map

用于基于现有数组创建新数组，而您的用例是关于修改其他对象

forEach

在这里更合适

相反，请尝试以下任一方法：

或者，只需迭代

副文本

：

if (mobile) {
  paraText.forEach((text, i) => {
    paragraphs[i].innerText = text;
  })
}

---

所以，您的问题是从数组中为特定段落选择正确的文本？Map接受第二个参数，即迭代的索引，您可以使用它从数组中提取相应的元素<代码>段落.map（（段落，索引）=>paraText[index]）

if (mobile) {
  let paragraphsArray = [...paragraphs];
  paragraphsArray.forEach((element, i) => {
    element.innerText = paraText[i];
  })
}

if (mobile) {
  paraText.forEach((text, i) => {
    paragraphs[i].innerText = text;
  })
}