使用Javascript动态替换HTML5标签

Question

我对Adobe Captivate如何生成其内容知之甚少，但它使用javascript在运行中动态生成html代码。我想在主html页面中添加一段Javascript代码，它会不断地检查这一行：

<video src="vr/Vi1.mp4" style="display: block; left: 0px; top: 0px; width: 1280px; height: 664px;"></video>

并用我选择的视频标签代替它。

到目前为止，我研究过的大多数“替换脚本”的问题是，它们只在页面打开时执行，但由于代码是动态生成的，并且标记可能在任何给定时刻出现，所以我需要一些在每次内容更改时检查页面的东西。

任何帮助都将不胜感激！问候

Answer 1

您需要的是检测何时将元素添加到页面，特别是<video>元素。有一个用于此的DOM事件，但它已被弃用-请参阅此answer。答案可能会对你有所帮助，公认的答案是setInterval()。

试试这个：

function checkVideo() {
    var videoTags = document.getElementsByTagName("video");
    if (videoTags.length > 0) {
        // do something with video
    }
    setTimeout( checkDOMChange, 1000); // schedule the next check

}

然后只需在加载文档时运行checkVideo() (例如，使用jQuery的$(document).ready(checkVideo) )。

jQuery也有一个函数live()，它应该可以解决你的问题，但是现在它被弃用了。