javascript - JS 在第一次加载时不工作 - 刷新后工作

Question

我在 JS 中做了一件相当简单的事情:我正在测试一个元素(基于类名)是否包含一个字符串。

我认为它不起作用的原因是元素是通过与 onload 事件分开的 HTTPS 请求呈现在页面上的。 (有点像嵌入式/iFrame 类型的东西)。

我的脚本示例:

(function($) {

//Only run on a specific page.
if(window.location.href.indexOf("SpecificPageImRunningOn") > -1) {

    //Wait for 3 seconds before running this script, to allow content to load
    setTimeout(function(){

        //Check if a class contains a string "Foobar"
        if($('.aSpecificClass').text().indexOf('Foobar') != -1){
            alert("Yes!");
        }
        else{
            alert("No!");
        }

    }, 3000);

}

})(jQuery);

当我第一次测试它时(新的浏览器清除缓存)，它没有按预期工作。

刷新后，它运行良好。

我已经尝试手动触发该功能(通过在加载所有内容后单击按钮)，但它的行为仍然没有任何不同。它在第一次加载时根本不起作用。

我还尝试通过设置 cookie 进行一次强制刷新，但似乎没有任何区别。

我想我遗漏了一些明显的东西!

Answer 1

您不应该依赖超时来等待元素准备就绪。第一次运行时，元素当时还没有准备好，而第二次是因为第一次运行后被缓存了。

要么将脚本放在页面底部，然后关闭 body 标记，要么使用 $(document).ready() DOM 准备就绪后运行一次的回调。