更改具有相同 class 名称的多个 iFrame

Question

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

然后我也会重新加载它们：document.getElementById('youtubebox').contentWindow.location.reload();

有没有办法让我重新加载所有具有相同 class 名称的文件？目前只有第一个重新加载。

{#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();
});

更改具有相同 class 名称的多个 iFrame

Changing multiple iFrames with same class name

javascript

iframe

svelte