javascript - 通过 Javascript 插入 HTML 时，静音视频无法自动播放

Question

我正在尝试插入 HTML5 <video>元素通过 Javascript，但它无法自动播放，尽管它​​是 静音 .
背景上下文
我想将我所有的 gif 资源转换为 mp4 格式。同样，我想要 HTML video模拟 gif。它应该包括以下属性:

静音

网页加载后自动播放

无限循环

在线播放

我目前正在使用 Chrome 100。
我试过的
相关代码持有within this codepen .我想通过 javascript 动态添加 HTML 视频。但是，即使指定了自动播放和静音属性，这也无法自动播放。
但是，如果我在我的 HTML 中直接编写了具有相同属性的视频元素，那么自动播放功能就可以正常工作。

如何使用 JS 插入视频并使其自动播放？

Answer 1

我认为您可以像这样设置属性:

const anchor = document.querySelector('#anchor');
const vid = document.createElement('video');
anchor.appendChild(vid);
vid.autoplay = true;
vid.loop = true;
vid.muted = true;
vid.playsinline = true;
vid.src = 'https://www.w3schools.com/html/mov_bbb.mp4';

尝试进行这些修改。如果它仍然不起作用，您可以在上面的代码之后添加这个内联:

vid.play()