Document    

在这种方法中,在解析代码时,首先在正文中的 html 之前加载 JavaScript 文件,如果 JavaScript 尝试操作正文中尚未解析的元素,则可能会导致错误,因为 HTML 内容尚未完全解析已加载。

这种阻塞行为会延迟页面其余部分的解析和渲染,影响性能和用户体验。

2.中的(在末​​尾)

             Document     

在此方法中,在加载和执行 JavaScript 之前完全解析 HTML,从而防止与丢失 DOM 元素相关的错误。这种方法很好,但由于 HTML 解析和 JavaScript 加载是顺序发生的,因此总体上可能需要更长的持续时间,因为这两个过程发生在不同的时间

3.中的

            Document    

在这种方法中,我们使 JavaScript 异步,因此它不会阻止 HTML 加载。 HTML 解析和 JavaScript 加载是并行发生的。但是,如果 JavaScript 在 HTML 完全解析之前执行,并且 js 尝试操作尚未加载的 html 元素,则可能会导致错误。
注意:—这种方法可以节省时间,但同时加载 html、js 但更容易出错

4.中的

            Document    

这种方法类似于第三种方法,其中 HTML 解析和 JavaScript 加载是并行发生的。然而,即使 JavaScript 先加载,浏览器也会等到 HTML 完全解析后再执行脚本

摘要:最佳方法

最好的方法通常是使用:


为什么:

如果脚本独立于 DOM 内容(例如跟踪脚本或广告),您可以使用异步以获得更好的性能。

","image":"http://www.luping.net/uploads/20241116/17317612906738948a85e57.jpg","datePublished":"2024-11-16T21:40:39+08:00","dateModified":"2024-11-16T21:40:39+08:00","author":{"@type":"Person","name":"luping.net","url":"https://www.luping.net/articlelist/0_1.html"}}
”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 在 HTML 中添加 Javascript 文件的最佳方法

在 HTML 中添加 Javascript 文件的最佳方法

发布于2024-11-16
浏览:912

Best Way to add Javascript file in HTML

在 HTML 中,有多种方法可以包含 JavaScript 文件。我将解释四种不同的方法及其缺点,最后强调最佳方法。

1.

中的
 


    
    
    Document
    





在这种方法中,在解析代码时,首先在正文中的 html 之前加载 JavaScript 文件,如果 JavaScript 尝试操作正文中尚未解析的元素,则可能会导致错误,因为 HTML 内容尚未完全解析已加载。

这种阻塞行为会延迟页面其余部分的解析和渲染,影响性能和用户体验。

2.

中的(在末​​尾)
 


    
    
    Document 


    


在此方法中,在加载和执行 JavaScript 之前完全解析 HTML,从而防止与丢失 DOM 元素相关的错误。这种方法很好,但由于 HTML 解析和 JavaScript 加载是顺序发生的,因此总体上可能需要更长的持续时间,因为这两个过程发生在不同的时间

3.

中的


    
    
    Document
    




在这种方法中,我们使 JavaScript 异步,因此它不会阻止 HTML 加载。 HTML 解析和 JavaScript 加载是并行发生的。但是,如果 JavaScript 在 HTML 完全解析之前执行,并且 js 尝试操作尚未加载的 html 元素,则可能会导致错误。
注意:—这种方法可以节省时间,但同时加载 html、js 但更容易出错

4.

中的


    
    
    Document
    





这种方法类似于第三种方法,其中 HTML 解析和 JavaScript 加载是并行发生的。然而,即使 JavaScript 先加载,浏览器也会等到 HTML 完全解析后再执行脚本

摘要:最佳方法

最好的方法通常是使用:


为什么:

  • 它不会阻止 HTML 解析(非阻塞下载)。
  • 它确保脚本在 DOM 完全解析后运行,从而更安全地操作 DOM 元素。
  • 如果您有多个延迟脚本,它会保留脚本执行顺序。

如果脚本独立于 DOM 内容(例如跟踪脚本或广告),您可以使用异步以获得更好的性能。

版本声明 本文转载于:https://dev.to/sagar7170/best-way-to-add-javascript-file-in-html-328?1如有侵犯,请联系[email protected]删除
最新教程 更多>

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3