src 和 href 的区别？

核心区别：

• src 表示把资源作为当前文档内容的一部分引入。

• href 表示建立当前文档与目标资源之间的引用关系。

• src（source）：用于嵌入资源到文档中，资源是页面的一部分（如脚本、图片）。

  <!-- 脚本嵌入到页面中执行 -->
  <script src="app.js"></script>
  
  <!-- 图片嵌入到页面中显示 -->
  <img src="photo.jpg" />
  
  <!-- 外部页面嵌入到当前文档 -->
  <iframe src="https://example.com"></iframe>

• href（Hypertext Reference）：用于关联资源，资源与页面存在逻辑关系但不会嵌入（如超链接、样式表）。

  <!-- 关联外部样式表 -->
  <link rel="stylesheet" href="styles.css" />
  
  <!-- 超链接跳转到其他页面 -->
  <a href="https://example.com">链接</a>
  
  <!-- 定义可点击区域 -->
  <area shape="circle" coords="50,50,50" href="page.html" />

如何记忆

• 遇到“把资源拿进来直接用”的场景，优先想到 src。
• 遇到“建立跳转、关联、引用关系”的场景，优先想到 href。