Question

代码：

<script>var posterimage=/images/videos/intro/iamge01.png;</script>
<script>document.write('<video controls="controls" height="300" id="video-playlist" poster="VARIABLE" preload="none" src="video.mp4" width="300"></video>');</script>

视频播放器在html中工作，但海报图片没有出现。

Answer 1

您需要使用字符串concatenation来执行此操作：

var posterimage= '/images/videos/intro/iamge01.png';
document.write('<video controls="controls" height="300" id="video-playlist" poster="' + posterimage +'" preload="none" src="video.mp4" width="300"></video>');

您也可以使用template literals执行此操作：

var posterimage= '/images/videos/intro/iamge01.png';
document.write(`<video controls="controls" height="300" id="video-playlist" poster="${posterimage}" preload="none" src="video.mp4" width="300"></video>`);

Answer 2

首先，您不需要每个脚本指令都是自己的 script标记。
其次，除非您这样做，否则不应该使用document.write() 在新的window中创建新内容。相反，只需填充一个预先存在的元素。
第三，必须引用文字字符串。

最后，您只需要将变量引用连接到你的字符串：

<script>
  // String literals must be quoted
  var posterimage = "/images/videos/intro/iamge01.png";

  // You should get a reference to an empty container element
  // that you want the video to go into and then just set the 
  // content of that element:
  elementReference.innerHTML(`<video controls="controls" height="300" 
                                     id="video-playlist" poster="` + 
                                     posterimage + `" preload="none" 
                                     src="video.mp4" width="300"></video>`);
</script>

如何在html标签的document.write中创建变量脚本？

2 个答案: