前端开发面试必备：HTML, CSS, JavaScript核心知识梳理

"本文主要涵盖了前端开发的相关知识点，包括常用库和框架、前端开发工具、BFC规范的理解、网站重构的引用以及WEB应用服务器向客户端推送数据的方式。此外，还涉及了HTML和CSS的面试问题，如浏览器兼容性、DOCTYPE的作用、布局方式的优势、HTML属性的异同、网页标准的重要性、存储机制的区别、图片优化策略、HTML语义化、SEO优化、DOM样式设置、CSS选择器、隐藏元素的方法、CSS Hack以及元素定位等。" 在前端开发中，标题提到的"Python核心编程（第3版）"虽然不是前端技术，但通常前端开发者可能需要一定的Python基础，例如在构建自动化脚本或后端API交互时。描述中提到了几个关键点： 1. **前端库和框架**：jQuery是最常用的库，使用率超过91%，其他还有YUI、Prototype、Dojo、Ext.js、Mootools等。轻量级框架包括Modernizr、underscore.js、backbone.js、Raphael.js等。理解这些框架的功能、性能和设计原理对于前端开发者来说至关重要。 2. **开发工具**：前端开发者常用的工具有SublimeText、Eclipse、Notepad++、Firebug、HttpWatch、Yslow等，用于编写、调试和优化代码。 3. **BFC规范**：Block Formatting Context（块级格式化上下文）是页面渲染的一部分，它规定了元素如何定位以及与其他元素的关系。理解BFC有助于优化布局和解决定位问题。 4. **网站重构**："99%的网站都需要被重构"出自《网站重构：应用web标准进行设计（第2版）》，强调了遵循Web标准的重要性，以提高可维护性和用户体验。 5. **WEB应用推送数据方式**：HTML5的WebSocket提供了实时双向通信，还可以通过Flash实现WebSocket，或者使用XHR长时间连接、XHRMultipartStreaming和不可见的Iframe等方式实现服务器向客户端的数据推送。 面试宝典部分涉及HTML和CSS的常见面试问题，涵盖以下知识点： - **浏览器兼容性**：测试的浏览器及其内核，例如IE、Firefox、Chrome、Safari等。 - **DOCTYPE**：声明文档类型，影响浏览器解析模式，分为Quirks模式和Standards模式。 - **布局优势**：div+css布局相比table布局，有利于响应式设计，提高SEO，代码结构清晰。 - **属性异同**：比如img的alt和title，以及strong和em的强调方式。 - **渐进增强和优雅降级**：前者确保基本功能在所有浏览器可用，后者侧重在现代浏览器提供高级体验，同时保证老浏览器的基本功能。 - **多域名存储资源**：可以分散请求，减少单个域名下的并发限制，提高加载速度。 - **网页标准和标准制定机构**：W3C等机构推动Web标准，确保跨平台、跨浏览器的一致性。 - **存储机制**：cookies、sessionStorage和localStorage的生命周期和应用场景。 - **src与href**：src用于引入外部资源，href用于链接到其他页面或资源。 - **图片格式**：JPEG、PNG、GIF等，根据需求选择合适的格式。 - **微格式**：用于增强HTML语义，利于机器解析。 - **CSS缓存处理**：HTTP头、浏览器缓存策略等影响CSS加载。 - **图片优化**：延迟加载、合并、压缩、CDN等方法。 - **HTML语义化**：使用恰当的标签描述内容结构，利于无障碍访问和SEO。 - **前端SEO**：元标签、URL结构、内容可爬取性等。 - **设置DOM样式**：内联样式、内嵌样式表、外部样式表，以及JavaScript操作CSS样式。 - **CSS选择器**：包括ID、类、标签、属性、伪类等。 - **隐藏元素**：display:none和visibility:hidden的区别。 - **CSS Hack**：针对特定浏览器的样式调整，如IE6-8的特殊写法。 - **行内元素与块级元素**：行内元素不独占一行，块级元素独占一行，两者都可设置padding和margin。 - **外边距重叠**：相邻块级元素垂直外边距可能出现重叠现象。 - **rgba()与opacity**：rgba()允许设置透明度，opacity影响元素及子元素的透明度。 - **垂直居中**：可使用相对定位、绝对定位、Flexbox或Grid实现。 - **px和em单位**：px是固定单位，em基于父元素的字体大小。 - **reset CSS**：清除浏览器默认样式，normalize.css则是规范化样式，保持跨浏览器一致性。 以上知识点涵盖了前端开发的多个方面，对于准备面试或提升前端技能的开发者非常有价值。