Javascript动画每页仅加载一次

我有一个SVG，动画波浪线。我希望这些波浪线在某一页上出现多次。然而，似乎只有第一个实例显示，其他实例不显示。。。我知道这一点，因为如果我删除inspector中的第一个，则会显示下一个

这是我的密码：

让xs=[]
对于（var i=0；i{
设y=10+2*Math.sin（（x+t）/5）
返回[x，y]
})
让path=“M”+points.map（p=>{
返回p[0]+“，“+p[1]
}).加入（“L”）
document.querySelector（“路径”）.setAttribute（“d”，路径）
t+=0.8
requestAnimationFrame（animatewavy）
}
animatewavy（）

。波浪线{
利润率：35px自动；
宽度：150px；
}
.波浪线svg{
高度：15px；
宽度：150px；
}
.波浪线路径{
笔画宽度：5px；
填充：无；
}
.波浪线.路径绿色{笔划：#56AE5F；}
.波浪线.路径蓝色{笔划：#1FB5D1；}
.波浪线.路径黄色{笔划：#F9B930；}

---

将document.querySelector（）更改为document.queryselectoral（）

或

---

更好的是，你可以迭代容器来修复你的动画。

将document.querySelector（）更改为document.queryselectoral（）

或

---

更好的是，您可以迭代容器来修复文档中的动画。

document.querySelector（“path”）

只返回第一个匹配项，这就是为什么只有第一个svg在动画中

要一次为所有svg设置动画，请使用

document.querySelectorAll

将所有

path

节点作为一个数组，并对它们进行迭代以调用每个节点的

setAttribute

，如下所示：

---

document.queryselectoral（“path”）.forEach（elem=>elem.setAttribute（“d”，path））

document.querySelector（“path”）

只返回第一个匹配，这就是为什么只有第一个svg在动画中

要一次为所有svg设置动画，请使用

document.querySelectorAll

将所有

path

节点作为一个数组，并对它们进行迭代以调用每个节点的

setAttribute

，如下所示：

---

document.queryselectoral（“path”）.forEach（elem=>elem.setAttribute（“d”，path））

您需要一个循环，实际上您的代码

document.querySelector（“path”）

将只针对第一个循环。您需要对所有其他路径进行迭代。您可能希望尝试

document.queryselectoral（“路径”）

而不是

document.querySelector（“路径”）

Hi！！啊，好吧，我的javascript中有一个循环，我想。。。很抱歉直截了当地问你。。。但是你能告诉我怎么做吗？很抱歉，这样做似乎根本不起作用，它只是停止了所有的显示。嗯，

querySelectorAll

返回一个你必须迭代的数组，因此行变成

document.querySelectorAll（“path”）。forEach（elem=>elem.setAttribute（“d”，path））

您需要有一个循环，实际上您的代码

document.querySelector（“path”）

将只针对第一个。您需要迭代所有其他路径。您可能想尝试

document.querySelector（“path”）而不是
document.querySelector（“path”）
Temani再次你好！！啊，好吧，我的javascript中有一个循环，我想…很抱歉问你怎么做…但是你能告诉我怎么做吗？很抱歉，做这个更改似乎根本不起作用，它只是停止了所有的显示。嗯，
querySelectorAll
返回一个你必须返回的数组操作结束后，该行变为
document.queryselectoral（“path”）.forEach（elem=>elem.setAttribute（“d”，path））
谢谢Daniel！不幸的是，进行此更改并添加“All”会破坏整个过程，并且没有一个有效。第二个选项是什么意思？按如下方式循环标记：let myPath=document.getElementsByTagName（“path”）；for（myPath中的x）{myPath[x].setAttribute（“d”，path）}谢谢Daniel！不幸的是，进行此更改并添加“All”会破坏整个过程，并且没有一个有效。第二个选项是什么意思？按如下方式循环标记：let myPath=document.getElementsByTagName（“path”）；for（myPath中的x）{myPath[x].setAttribute（“d”，path）}