前端面试精华：css表头固定与src(href)差异、sessionStorage与cookie对比

本文档主要针对前端开发面试中的常见问题进行了总结，分为三个部分：CSS实现固定表头、JavaScript中src与href的区别，以及客户端存储选项——sessionStorage、localStorage和cookie的对比。 首先，**CSS实现table固定表头**是一个基础但重要的知识点。在前端开发中，通过CSS的position属性（通常配合`position: sticky`）以及z-index来实现表格头部在滚动时始终保持可见。这涉及到对CSS定位特性的理解，以及响应式设计的实践。 **src与href的区别**是JavaScript编程中的一个关键概念。`href`是超文本引用，它指定了资源的URL，常用于`<a>`标签链接到其他网页或下载资源。`src`则是`source`的缩写，主要用于`<img>`, `<iframe>`, `<script>`等标签，将外部资源下载到文档中并插入到相应位置。`href`的加载是异步的，不会阻塞页面渲染，而`src`则会暂停其他资源加载直到当前资源加载完成，体现了它们在页面结构和性能上的不同影响。 关于**sessionStorage`, `localStorage`和`cookie`**，它们都是客户端存储数据的方式，存储在用户的浏览器上。共同点是同源策略限制，即数据只能在特定来源的页面间共享。然而，它们有明显的差异： - **容量限制**：cookie的大小有限制（通常4K），不适合大量数据存储；而sessionStorage和localStorage的容量相对较大，可以存储更丰富的数据。 - **生命周期**：cookie基于HTTP请求发送，关闭浏览器后会清除，适合临时会话信息；localStorage和sessionStorage则具有更长的生命周期，sessionStorage在浏览器会话结束时失效，localStorage则持久存在。 - **共享性**：sessionStorage仅限于同一浏览器窗口内的页面共享，而localStorage不受此限制。 掌握这些基础知识对于前端开发者来说至关重要，它们涉及到前端开发的核心技术应用，包括页面布局、数据管理和性能优化等方面。在面试中，候选人对这些问题的回答将反映出他们对HTML、CSS和JavaScript的理解程度，以及在实际项目中的实践经验。