html怎么引用js文件_html引用js文件路径【设置】

5次阅读

script 标签的 src 属性可用相对路径、绝对路径或根目录路径,解析基准是当前 html 文件位置;推荐生产环境用根相对路径(/js/main.js),本地开发避免协议相对 url;模块脚本中 import 路径才相对于 js 自身位置。

html怎么引用js文件_html引用js文件路径【设置】

script 标签的 src 属性必须用绝对路径还是相对路径?

取决于你的文件组织方式,但绝大多数情况下用相对路径更稳妥。浏览器加载 <script></script> 时,src 的解析基准是当前 HTML 文件所在位置,不是服务器根目录,也不是 JS 文件自身位置。

常见错误现象:404 Not Found 报错,控制台显示请求路径明显不对(比如多了一层 js/ 或少了一层 ../)。

  • HTML 在 /index.html,JS 在 /js/main.js → 写 <script src="js/main.js"></script>
  • HTML 在 /pages/about.html,JS 在 /js/main.js → 写 <script src="../js/main.js"></script>
  • 想统一从根目录算起(推荐用于生产环境)→ 写 <script src="/js/main.js"></script>(注意开头的 /

放在 head 还是 body 底部?deferasync 怎么选?

默认阻塞渲染,所以不加属性时,<script src="..."></script> 放在 里会让页面白屏等待 JS 下载执行完;放 前虽能避免白屏,但 JS 无法操作尚未解析的 dom 元素。

  • 需要操作 DOM 且逻辑简单 → 放
text=ZqhQzanResources