javascript - 更改具有相同类名的多个 iFrame

Question

一开始我可能没有正确地完成此操作，但是，我在 Svelte 中有一个 #each 循环创建 iframe 并将 src 设置为 {vid}。

然后我还使用以下命令重新加载它们: document.getElementById('youtubebox').contentWindow.location.reload();

有没有办法可以重新加载所有具有相同类名的类？目前只有第一个重新加载。

{#each vids as vid}
  <div class="col-md service">
     <iframe class="youtubebox" width="300" height="225"
     src="https://www.youtube.com/embed/{vid}">
     </iframe>> 
   </div>
{/each}

Answer 1

您可以使用document.querySelectorAll()为此目的，例如:

document.querySelectorAll('.youtubebox').forEach(function(iframe) {
    iframe.contentWindow.location.reload();
});