htm 如何调用js_在HTM文件中调用JS的方法

html如何引用js

上周我学习了两种在HTML中引用JS的方法。

内联脚本： 直接在 HTML 中编写脚本标签。
代码与 HTML 混合在一起。
适合简单的逻辑。
同步执行会阻止页面的呈现。
维护和使用困难。

外部脚本： 将 src 属性添加到 script 标签以引用 .js 文件。
代码是分开的。
易于维护且易于重复使用。
同步加载会阻止 HTML 解析。

优化： defer 属性：等待 HTML 解析完毕后再按顺序执行。
async属性：下载后执行，顺序不确定。

最佳实践： 对简单代码使用内联。
使用外部文件来处理复杂的代码。
脚本标签放置在正文文本的末尾。
异步或传输到外部脚本。
外部文件支持缓存。
使用 Webpack 进行模块化。

示例： doctype
头 标题JS参考示例 脚本 src=library.js 延迟 身体 脚本console.log（页面加载...） 脚本 src=main.js defer
注释： 不要混合使用内联和外联。
使用 ES6 模块或 Webpack 进行现代开发。
选择正确的方法来平衡维护和性能。

html如何引用外部js

我记得上次我帮助同事修复网站时，他抱怨加载速度慢。
我一看，哦，头里所有的JS文件都加载了。
我告诉他这必须改变。
后来试了一下，嘿嘿，速度真快。
你看，要在 HTML 中引用外部 JS，只需添加一个 script 标签并给它一个指向文件路径的 src 即可。
例如，在这个例子中，我在<head>处添加了一个脚本，指向external_script.js，并在<body>的末尾添加了一个脚本，指向js目录中的external_script.js。
这样浏览器先渲染页面，加载主要内容，然后再回去加载JS，这样用户的感觉就非常好。
但是路径是对的，别写错了，不然就4 04 了。
我有一个项目。
之前我用的是完美路径，但是部署到新服务器的时候就出现问题了。
我现在已将其更改为相对路径。
像 Webpack 这样的打包工具使用起来很有趣。
制作一个包含所有内容的大文件，并且只需要加载一次。
等等，还有一件事，你认为浏览器是按顺序处理JS的吗？正确的？异步加载，如何确认顺序？