- 博客(4)
- 收藏
- 关注
RSS订阅原创 ＜script＞中的type=“importmap”和type=“module”是成对出现的么？能否分开使用
本文分析了type="importmap"和type="module"的关系与使用方式： type="module"可独立使用，支持ES模块语法；type="importmap"需配合模块脚本才能生效，且必须定义在所有模块脚本之前。 二者分开使用时：模块脚本可直接导入具体路径，而importmap单独存在但无模块脚本时会失效。 正确配合方式：先定义importmap路径映射，再通过模块脚本使用裸模块名导入。 注意事项包括单页唯一
2025-06-12 23:32:10
831
原创 HTML中使用Vue的延迟加载问题
摘要：本文探讨了在HTML中使用defer属性加载Vue框架时出现"Vue is not defined"错误的原因及解决方案。问题根源在于浏览器会忽略内联脚本的defer属性，导致脚本在Vue加载前执行。提供了两种解决方案：1)移除内联脚本的defer，改用DOMContentLoaded事件；2)将内联脚本转为外部文件并使用defer。最佳实践建议避免在内联脚本使用defer，确保Vue库先于业务脚本加载，并推荐在生产环境中将JS与HTML分离。文章还附带了相关参考链接，帮助理解sc
2025-06-11 23:52:11
205
原创 HTML的＜script＞中，defer和async同为延迟加载，有什么区别？
摘要：async和defer用于优化JS脚本加载。async异步下载后立即执行（顺序不确定），适合独立脚本；defer异步下载但延迟到HTML解析后按序执行，适合DOM操作和依赖脚本。关键区别在于执行时机和顺序控制：async执行会中断解析，defer则不会。建议DOM相关用defer，独立脚本用async，避免同时使用二者。现代浏览器模块化脚本默认类似defer行为。（149字）
2025-06-10 23:09:46
1279
2
原创 ＜script＞标签通常位于HTML文件的什么位置？
在HTML中，<script>标签的放置位置对页面性能有显著影响：放在<head>中会阻塞渲染但适合优先执行的脚本；置于<body>末尾（推荐）不阻塞渲染且能操作完整DOM；内联脚本应避免。高级优化可使用async（独立脚本）和defer（依赖DOM的脚本），它们异步加载且不阻塞渲染。最佳实践包括：优先放<body>末尾，关键库用defer加载，避免内联事件，大型库使用CDN+async/defer。合理放置脚本能提升页面加载速度和用户体验。
2025-06-09 18:11:11
1005
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人