google-chrome - 创建所有 dom 后如何运行 google chrome 扩展的内容脚本

Question

我有一个 google chrome 扩展程序，需要从 dom 获取视频 URL

var videolink = document.getElementsByTagName('video')[0].attributes.getNamedItem('src').nodeValue;

我发现视频元素是在页面加载后由 javascript 创建的。所以我尝试在“document_idle”阶段运行上面的内容脚本。但似乎视频元素即使在那时也没有初始化。

有什么方法可以让我稍后运行内容脚本，然后初始化视频元素？

Answer 1

处理由 javascript 创建/加载的元素的最简单、最可靠的方法是轮询它们：

var waitForVideo = setInterval (checkForElement, 150);

function checkForElement () {
    var videoElem       = document.getElementsByTagName ('video');
    if (videoElem.length) {
        clearInterval (waitForVideo);
        var videolink   = videoElem[0].getAttribute ('src');
        // DO WHATEVER, WITH videolink HERE.
    }
}

---

或者，您可以尝试全新的DOM Mutation Observers，但这些只是添加到 Firefox 和 Chrome 中，在这种情况下可能有点矫枉过正。

Answer 2

如果您可以在扩展程序中编辑页面，您应该能够向元素添加一个onLoad=yourFunction()属性，以便在元素准备好后它会调用您的函数。