Question

我正在开发SaaS平台。我无法访问app.js文件。但是，我可以在页脚中上传自己的JS。目前，我有一个函数，通过检查主包装器是否有一个菜单活动类，在单击测试上查看菜单是否打开。发生以下两种情况之一，如果菜单处于活动状态，我会删除叠加层，如果不是，我会添加一类叠加层。不幸的是，app.js，我无法访问，使用toggleClass删除CSS的菜单活动类。有时候，app.js会删除我首先检查的类并弄乱我的功能。但是，大部分时间它都有效。如何在100％的时间内首先调用我的函数？我正在使用JQuery 2.1.1

$(".menu-toggle").first().click(function () {
            if (!$("#wrapper").hasClass("menu-active")) {
                $("#wrapper").find("div:first").addClass("overlay");
            }
            if ($("#wrapper").hasClass("menu-active")) {
              $("#wrapper").find("div:first").removeClass("overlay");
            }
        });

Answer 1

您可以将支票包裹在setTimeout：

中

$(".menu-toggle").first().click(function () {
    setTimeout(function() {
        if (!$("#wrapper").hasClass("menu-active")) {
            $("#wrapper").find("div:first").addClass("overlay");
        }
        if ($("#wrapper").hasClass("menu-active")) {
            $("#wrapper").find("div:first").removeClass("overlay");
        }
    }, 1);
});

应该导致在浏览器更新DOM之后进行检查。

Answer 2

进行以下操作，

<link rel="preload" href="path-to-your-script.js" as="script">
<script>
   var scriptPriority = 
    document.createElement('script');
    scriptPriority.src = 'path-to-your-script.js'; 
    document.body.appendChild(scriptPriority);
</script>

关于：Link rel Preload 链接rel preload是一些开发人员使用的方法，它几乎没有人知道它的用途，它可以优先使用脚本或链接css。

更多信息： https://developers.google.com/web/updates/2016/03/link-rel-preload https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content

如何确保首先调用javascript函数？

2 个答案: