在页面加载之前执行 Javascript

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11773277/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 14:17:31  来源:igfitidea点击:

Execute Javascript before Page load

javascriptjqueryhtml

提问by David Murray

I'm having an issue with Mysite, the navigation bar is javascript and bits of jquery, I've played around with some code to try and get the navigation bar to load before page view but cant seem to find the right code.What would be the correct way to achieve this?

我的Mysite有问题 ,导航栏是 javascript 和一些 jquery,我玩了一些代码来尝试在页面查看之前加载导航栏,但似乎找不到正确的代码。怎么办是实现这一目标的正确方法吗?

回答by John

The script will execute whenver the page loads

该脚本将在页面加载时执行

<script type="text/javascript">
    window.onload=body_load;

    function body_load()
    {

    dosomethingwithelementA();

    }

    </script>

    <div id="A"></div>

OR u do with jquery whenever the dom is ready

或者你在 dom 准备好时使用 jquery

$(document).ready(function()
{
    dosomethingwithelementA();

});

回答by Elias Van Ootegem

There are a few things that can help:

有几件事可以提供帮助:

  1. Put the <script>tags just below your navigation elements, and in case of the jQuery code, don't use the $(document).ready(function(){wrapper, BC that'll postpone the execution for as long as it takes for the page to load.
    Alternatively, instead of waiting for the entire document to be ready, there really is nothing to stop you from doing something like $('#navContainer').ready(function(){, to execute the jQuery bit as soon as the navigation elements have been loaded.

  2. That said, you can't really determine what loads when, that's somewhat out of your hands. I have, however, seen people rendering HTML with an attribute like style="display:none;", and then use JavaScript to remove the attribute when they've done what needs to be done/seen first. Downside: as always: JS-disabled browsers get to see no content at all. Ah, well, screw them

  3. There are more elaborate answers, too. For instance: provide your pages with an empty content div, and only the navigation and bind the onloador $(doc).readyevent to an ajax call to fetch the actual content of your site. But that is, IMO, a borderline insane workaround.

  1. <script>标签放在导航元素的正下方,对于 jQuery 代码,不要使用$(document).ready(function(){包装器,BC 会在页面加载时推迟执行。
    或者,不是等待整个文档准备好,实际上没有什么可以阻止您执行类似的操作$('#navContainer').ready(function(){,以便在导航元素加载后立即执行 jQuery 位。

  2. 也就是说,您无法真正确定何时加载什么,这有点超出您的掌握。但是,我曾看到人们style="display:none;"使用类似 的属性呈现 HTML ,然后在完成需要先完成/查看的操作后使用 JavaScript 删除该属性。缺点:一如既往:禁用 JS 的浏览器根本看不到任何内容。啊,好吧,去他妈的

  3. 还有更详细的答案。例如:为您的页面提供一个空的内容 div,并且只提供导航并将onloador$(doc).ready事件绑定到 ajax 调用以获取您网站的实际内容。但这就是,IMO,一种边缘疯狂的解决方法。

Pick and choose any of the above options, or use all of them together

选择以上任何选项,或将它们全部一起使用

回答by David Murray

As far as I know theres no way to really load HTML before the Page starts. You should use JQUERY Events to wait with displaying the toolbar until it is loaded. Or maybe just set"display:none" to your toolbar, then use window.onload event to display the toolbar after adding all the Effects.

据我所知,在页面开始之前无法真正加载 HTML。您应该使用 JQUERY 事件来等待工具栏的显示,直到它被加载。或者可能只是将“display:none”设置为您的工具栏,然后在添加所有效果后使用 window.onload 事件来显示工具栏。

回答by saibotd

Move the inclusion of your script into the <head></head>, that may help. But still, the DOM has to be loaded before any JS is fired.

将您的脚本包含到 中<head></head>,这可能会有所帮助。但是,仍然必须在触发任何 JS 之前加载 DOM。