尝试将两个 querySelectorAll 项添加到 JavaScript 中的 forEach 循环

Question

我一直在尝试将 newText.innerText 应用于 oldText.innerText，它只采用 newText 中的最后一个元素并将其应用于我尝试添加索引的所有 oldText和数组到循环和运行将它们添加为数字计数器后的代码但它仍然不起作用，我还尝试定义一个新元素并为其分配 newText 值但仍然没有没用

      <body>
        <h3 class="oldText">oldText</h3>
        <h3 class="oldText">oldText</h3>
        <h3 class="oldText">oldText</h3>
        <h3 class="oldText">oldText</h3>
        <h3 class="oldText">oldText</h3>
    
        <h3 class="newText">newText1</h3>
        <h3 class="newText">newText2</h3>
        <h3 class="newText">newText3</h3>
        <h3 class="newText">newText4</h3>
        <h3 class="newText">newText5</h3>
        
<script> 

    var oldText = document.querySelectorAll('.oldText')
    var newText = document.querySelectorAll('.newText')
    oldText.forEach((oldT) => {
      newText.forEach((newT) => {
      oldT.innerText = newT.innerText
      })
    })

</script>
      </body>
    </html>

当我试图让旧文本具有相同的内部文本时

Answer 1

你不应该有嵌套循环。只需遍历每个 oldText 元素并将其 .innerText 分配给相应 newText 元素的 .innerText：

var oldText = document.querySelectorAll('.oldText')
var newText = document.querySelectorAll('.newText')
oldText.forEach((oldT, i) => {
  oldT.innerText = newText[i].innerText
})

i 是 newText 数组的索引。

Answer 2

您可以像这样简单地使用 for 循环，而不是使用 foreach 循环：

var oldText = document.querySelectorAll('.oldText')
var newText = document.querySelectorAll('.newText')
for (var i = 0; i < oldText.length; i++){
  oldText[i].innerText = newText[i].innerText;
}

尝试将两个 querySelectorAll 项添加到 JavaScript 中的 forEach 循环

trying to add two querySelectorAll items to a forEach loop in JavaScript

javascript

foreach