如何在 ","tag" 的前面嵌入 JavaScript 脚本

开发
1

我想更改 discourse 中视频的样式，如何在 </body 标签之前嵌入 JavaScript 脚本？

尝试在 HEAD 中编辑，但效果不完美！

谢谢！

image
image1810×938 93.9 KB

      <script src="/plyr.js"></script>
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            const player = new Plyr('video');
        });
    </script>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Video Player</title>
    <link rel="stylesheet" href="https://cdn.plyr.io/3.6.12/plyr.css">
    <script src="https://cdn.plyr.io/3.6.12/plyr.js"></script>
</head>
<body>
    <video controls>
        <source src="your-video.mp4" type="video/mp4">
    </video>


    <script>
        document.addEventListener('DOMContentLoaded', function () {
            const player = new Plyr('video');
        });
    </script>
</body>
</html>
2

您在哪里更改它？在您在 UX 中创建的主题组件中？（我不知道那张图片是什么。）

4

这很有可能是因为你没有把这个域名加入CSP Policy。

And to be honest, I recommend you to copy this js file directly and throw it in the <script> tag to prevent users from loading js from an external website. This is not safe - unless you completely trust this website.

说实话，我更推荐你直接把这个js文件复制过来扔在<script>标签里，以免用户还要加载外部网站的js，这并不能说安全——除非你完全信任这个网站

image
image1068×200 25 KB

1 个赞
5

主要是这一句啊，前面的都不是问题

    <script>
        document.addEventListener('DOMContentLoaded', function () {
            const player = new Plyr('video');
        });
    </script>
</body>
6

只能放在body结尾，这个是等页面加载完了，初始化播放器的

7

你可以用一下discourse plugin-api

You can use the discourse plugin api.

<script type="text/discourse-plugin" version="0.8">
api.decorateCookedElement((elem, helper) => {
    const player = new Plyr('video');
}, {id: "beauitfy-video"})
</script>

Ah, you only need to load once? Then pretend I didn’t say it

啊你只需要一次load？那当我没说

这毫无关系。你不是有eventListener吗？

It makes no difference. Don’t you have an eventListener?

8

:sweat_smile: 不懂怎么弄啊 要放在body前面才行

9

查了下 懂了 在这个地方添加

image
image2050×801 46.1 KB

11

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.