前端开发中经常看到link relstylesheet href./style.css a href/about关于/a img src./logo.png script src./main.js/script以及import axios from axios import App from ./App它们看起来都像“引入资源”但作用并不一样。1.href指向一个地址href常用于“链接”或“关联资源”。a href/about关于我们/a表示点击后跳转到/about也可以出现在link relstylesheet href./style.css这里表示当前页面关联的 CSS 文件地址是./style.css。所以可以记href 指向哪里2.link关联外部资源link是 HTML 标签link relstylesheet href./style.css其中relstylesheet表示这个资源是 CSS 样式表。href./style.css表示 CSS 文件的位置。所以link → 建立页面和外部资源的关系 href → 告诉浏览器资源在哪里3.src加载资源src是source表示资源来源。图片img src./logo.png表示浏览器加载logo.png并显示。JSscript src./main.js/script表示浏览器加载并执行main.js。所以src 这个标签要加载的资源来自哪里常见img src script src/script video src/video4.href和src的区别可以简单记href → 指向 / 关联 src → 加载例如a href/user用户中心/a只是建立一个跳转地址。而img src./user.png浏览器会真正把图片加载进页面。5.import导入 JS 模块import属于 JavaScript / TypeScript 模块语法。例如import axios from axios表示把 axios 导入当前文件。自己写的模块也可以// add.js export const add (a, b) a b另一个文件import { add } from ./add console.log(add(1, 2))可以记export → 导出去 import → 导进来React / Vue 中也经常看到import App from ./App import ./index.css其中 CSS 能被import是因为 Vite、Webpack 等构建工具会帮我们处理。6. 最后总结写法作用link关联外部资源href指定链接或资源地址src指定要加载的资源import导入 JS / TS 模块最常见组合a href link href img src script src以及import xxx from xxx总结href是“指向哪里”src是“从哪里加载”import是“从别的模块拿代码”link是负责关联外部资源的 HTML 标签。