当前位置: 首页 > 知识库问答 >
问题:

您可以在超文本标记语言标记上同时使用异步和延迟属性吗?

康泽宇
2023-03-14

我想使用deferasync加载以下JavaScript代码:

由于Internet Explorer 5.5支持defer,正如您在CanIUse.com看到的那样,如果异步不可用,我想优雅地回退到使用deer。异步我认为在它可用时使用更好,但直到Internet Explorer 10才支持它。

因此,我的问题是,上述代码是否有效?如果没有,当async不可用时,是否可以使用JavaScript在脚本上优雅地使用defer


共有3个答案

邹海荣
2023-03-14

不幸的是,当指定async时,defer被忽略,并且async总是具有更高的优先级。

我个人认为,延迟被忽视是非常糟糕的。让我们想象一下,当我们希望尽快初始化一些JS时,甚至在加载页面内容之前。但是我们希望这个脚本在需要它的其他脚本之前初始化。它应该是延迟队列中的第一个。但不幸的是,这是行不通的:

<!-- we want "jQuery" ASAP and still in "defer" queue. But defer is ignored. -->
<script src="jquery.min.js" async defer></script>

<!-- this doesn't blocks the content and can wait the full page load, but requires "jQuery" -->
<script src="some_jquery_plugin.min.js" defer></script>

在这个示例中,“some_jquery_plugin.min.js”可以在加载jquery之前加载并执行,并且会失败:(

所以有两种方法可以解决这个问题:要么只使用defer指令,要么将所有依赖的javascript文件合并到单个JS中。

湛光华
2023-03-14

问题是,你希望它做什么?如果async和defer都存在,我希望脚本会被延迟,并且只有在浏览器空闲时DOMContentLoaded之后才执行,但是如果我正确阅读了规范,那么如果设置了async并且脚本是异步加载的,那么defer看起来会被忽略,所以它将在可用时立即执行,这很可能在DOMContentLoaded之前,并且可能会阻塞其他资源。

使用这些属性可以选择三种可能的模式。如果存在async属性,则脚本将在可用时立即异步执行。如果不存在async属性,但存在defer属性,则在页面完成解析后执行脚本。如果两个属性都不存在,那么在用户代理继续解析页面之前,将立即获取并执行脚本。

https://www.w3.org/TR/2011/WD-html5-20110525/scripting-1.html#attr-脚本异步

齐文林
2023-03-14

根据规范:https://www.w3.org/TR/2011/WD-html5-20110525/scripting-1.html#attr-脚本异步

即使指定了async属性,也可以指定defer属性,以使仅支持defer(而非async)的传统Web浏览器退回到defer行为,而不是默认的同步阻塞行为。

(查看下面的参考链接,以查看正常脚本和带有延迟和异步的脚本之间差异的可视化表示)

参考资料:

  • 异步vs延迟属性
  • 使用defer和async高效加载JavaScript
 类似资料:
  • 我在jQuery中看到了这一点——它做了什么?

  • 定义和使用自定义标记可以吗?(这不会与将来的html标记冲突)-通过更改outerHTML替换/呈现这些标记?? 我在下面创建了一个演示,看起来效果不错 问题的最新情况: 让我进一步解释一下。请假设浏览器上启用了JavaScript-也就是说,应用程序不应该在没有javascript的情况下运行。 我见过使用自定义属性在指定标记中定义自定义行为的库。例如,角度。js大量使用自定义属性。(它还有关于

  • 我试图在HTML的pre标签中包装文本,但它不起作用。我使用下面的CSS作为我的标签。 我从如何在pre标记中换行文本? 我已添加

  • 我在研究Thymeleaf,发现在几乎所有的例子中,都有Thymeleaf的标记值和标准HTML值,比如: 这些标准标记值,如或等,被控制器忽略,不会在页面上呈现。 我想知道,让它们来提高代码可读性只是一种好的做法,还是最好删除它们来清理代码? 因为对于编译器来说,它们是无用的,对渲染结果没有任何影响。

  • 我有一个聊天应用程序,通过API接收HTML作为JSON。每个聊天信息都在文本视图中显示HTML,但我需要显示表格和标记。我尝试了Html。fromHtml()函数和图像的ImageGetter,但是我找不到显示表标记的方法。 我不能使用WebView,因为这意味着为每条消息显示一个WebView(这不是很有效)。 提前感谢。

  • 对于上面的html内容,我如何使用Jsoup解析并获取文本 当我使用 我得到了这样的东西