个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
24
4
我正在使用 Vuejs，我需要在 DOM 中动态插入脚本标签，以这种方式嵌入 JWPlayer 视频:
<body>
<!-- HTML content -->
<script src="//content.jwplatform.com/players/KZVKrkFS-RcvCLj33.js"></script>
<!-- More HTML content -->
<script src="//content.jwplatform.com/players/ANOTHER-ID-ANOTHER-PLAYERID.js"></script>
</body>
我没有使用 results: v-html 指令来渲染 html 标签。还有 v-bind:src 但都不执行代码。我找到了这个解决方案，但它也不起作用:How to add external JS scripts to VueJS Components
我使用了这个解决方案，但脚本标签(每个视频一个)必须插入正文(而不是头部):他们应该创建 div 标签容器并嵌入视频。问题是嵌入的 JWPlayer 文件包含一个 document.write() 语句。浏览器控制台显示:“从异步加载的外部脚本调用 document.write() 被忽略。”
有什么办法可以实现吗？
最佳答案
您提供的链接应该有效。
在使用 JWPlayer 之前，您可能只需要等待脚本加载。
const script = document.createElement('script')
script.onload = () => {
// Now you can use JWPlayer in here
}
script.src = '//content.jwplatform.com/players/MEDIAID-PLAYERID.js'
document.head.appendChild(script)
还要确保您只对需要它的第一个组件执行一次此操作，从那时起 JWPlayer 将被加载并且您可以在不插入另一个脚本标记的情况下使用它。
关于html - Vuejs 2 : How to include (and run) a script tag javascript file in the DOM dynamically?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47767841/
24
4
0
我是一名优秀的程序员,十分优秀！