延迟脚本和DOM [英] Deferred scripts and DOM
问题描述
我仅在DOM准备就绪时才需要运行脚本,因为脚本会对某些标记的某些属性进行一些重写.
I need to run script only when DOM is ready as script does some rewriting of certain attributes of certain tags.
当前,我在DOMContentLoaded
上使用document.addEventListener
,或者在onreadystatechange
上使用document.attachEvent
(如果不可用),并且如果都未提供,我将使用window.onload
功能.
Currently I use document.addEventListener
on DOMContentLoaded
or if not available document.attachEvent
on onreadystatechange
and if both not given I use window.onload
functionality.
我了解了defer
标记,该标记表示应在 文档解析后执行的脚本.
I read about defer
tag for scripts that should be executed after document is parsed.
- 这是否意味着通过设置
defer
属性,我可以在DOM准备就绪时轻松地执行脚本? - 有没有我可能会想念的隐藏东西?
- Opera,WebKit,Firefox,IE的支持程度如何?
- Does this mean that by setting
defer
attribute I can easily execute my script when DOM is ready? - Is there some hidden stuff I may miss?
- How well is supported i.e. Opera, WebKit, Firefox, IE?
我知道像JQuery这样的库,但是由于需要很小的脚本,所以我不能使用它们,所以我需要一个低级的解决方案.>
I'm aware of libraries like JQuery but I can't use them as I need very small script so I need a low level solution.
推荐答案
defer
属性的正确实现将在DOM完成解析后自动运行脚本,因此脚本中的任何代码都不必自己执行加载DOM的逻辑.您可以阅读此Mozilla文章以了解更多详细信息.
A proper implementation of the defer
attribute will automatically run the script after the DOM has finished parsing so any code in the script does not have to do it's own logic for when the DOM is loaded. You can read this Mozilla article for more details.
但是,并非所有较旧的浏览器都支持defer
属性,因此您必须确定要支持的浏览器以及不支持延迟的浏览器的策略.您可以在这篇SO帖子中阅读浏览器实现的历史记录.在switcheroo中,它首先在IE中实现,然后在Firefox中实现,然后在Safari和Chrome中实现.从该帖子中的日期/版本来看,除了Opera之外,现在依靠它看起来很安全,但是您必须深入研究该帖子中的详细信息,以确保它满足您的要求.
However, the defer
attribute is not supported in all older browsers so you have to decide what browsers you want to support and what your strategy is for any that don't support defer. You can read the history of browser implementation in this SO post. In a switcheroo, it was implemented first in IE, then in Firefox, then in Safari and Chrome. Judging by the dates/versions in that post, it looks like it's pretty safe to rely on it now except for Opera, but you'll have to dive into the details in that post to be sure it meets your requirements.
下面的图表显示了浏览器对defer
的支持: http://caniuse.com/script-defer .
Here's a chart that shows browser support for defer
: http://caniuse.com/script-defer.
据我所知,defer
的主要争议是多个defer
脚本是否按顺序执行(应该按顺序执行)以及它们如何与使用async
的脚本交互.标准和实现现在很清楚,但并非总是如此.但是,如果只有一个独立的defer
脚本,而您只关心在解析DOM之后执行,则应该是安全的.
As best I can tell, the main controversy with defer
is whether multiple defer
scripts execute in order or not (they are supposed to execute in order) and how they interact with scripts that use async
. The standards and implementations are now clear, but were not always. But, if you just have one stand-alone defer
script that you only care about executing after the DOM is parsed, you should be safe.
这篇关于延迟脚本和DOM的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!