一、对浏览器的了解？
1.浏览器的构成：
浏览器可以分为两部分，shell+内核。（shell种类多，内核较少。）
①Shell是指浏览器的外壳：例如菜单，工具栏等。主要是提供给用户界面操作，参数设置等。它是调用内核来实现各种功能的。内核才是浏览器的核心。
②内核：是基于标记语言显示内容的程序或模块。也有一些浏览器并不区分外壳和内核。
注：从Mozilla将Gecko独立出来后，才有了外壳和内核的明确划分。目前主流的浏览器有IE6、IE8、Mozilla、FireFox、Opera、Safari、Chrome、Netscape等。
2.什么是浏览器内核
浏览器内核：可以分成两部分：渲染引擎(layout engineer或者Rendering Engine)和JS引擎。
作用：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。
浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。
JS引擎：是解析Javascript语言，执行javascript语言来实现网页的动态效果。
注：最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎。
内核的种类：非商业的免费内核（很少使用），有10多种。
3.常见的浏览器内核介绍
常见的浏览器内核可分四种：Trident、Gecko、Presto、Webkit。
①Trident又称MSHTML，是微软开发的渲染引擎，他已经深入了Windows操作系统的骨髓，例如Windows Media Play，Windows Explorer，Outlook Express等都使用了。目前很多浏览器都使用这个引擎，例如IE,MaxThon,TT,The World,360,搜狗浏览器等 。
②Gecko是C++开发的，Open Source的渲染引擎，包括了SpiderMonkey(Rhino)。主要的使用者有Firefox。
③Webkit是苹果公司基于KHTML开发的。他包括Webcore和JavaScriptCore（SquirrelFish,V8）两个引擎。主要的使用者有Safari，Chrome。
④Presto由Opera Software公司开始的，用于Opera的渲染引擎。Macromedia Dreamweaver （MX版本及以上）和Adobe Creative Suite 2也使用了Presto的内核。
4.主流浏览器所使用的内核分类
Trident内核：IE,MaxThon,TT,The World,360,搜狗浏览器等
Gecko内核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等
Webkit内核：Safari,Chrome等
Presto内核：Opera7及以上
5.浏览器内核的优缺点
Trident：这种浏览器内核是IE浏览器用的内核，由于IE的高市场占有率，微软也很长时间没有更新Trident内核（本身BUG比较多），这导致了二个结果 1，Trident内核和W3C标准脱节。 2，Trident内核的大量Bug等安全问题没有得到解决，加上一些专家学者公开自己认为IE浏览器不安全的观点，使很多用户开始转向其他浏览器，FF,Opera就是这时期兴起的。
Gecko：这是Firefox 和 Flock 所采用内核，这个内核的优点就是功能强大、丰富，可以支持很多复杂网页效果和浏览器扩展接口，但是代价是也显而易见就是要消耗很多的资源，比如内存。
Presto：Opera 采用的是 Presto内核，
优：Presto内核被称为公认的浏览网页速度最快的内核，这得益于它在处理JS脚本等脚本语言时，会比其他的内核快3倍左右。
缺：就是为了达到很快的速度而丢掉了一部分网页兼容性。
Webkit：Webkit 是 Safari 采用的内核，
优：就是网页浏览速度较快，虽然不及 Presto 但是也胜于 Gecko 和 Trident，
缺：是对网页代码的兼容性较低，会使一些编写不标准的网页无法正确显示。
总结：就浏览器来说，互联网经历了十年的高速发展期，近几年市场上也推出了很多新的浏览器，但是他们并非是采用自主开发的内核，所以浏览器内核本身实际没有实质突破。
二、safari移动端click时间延迟300ms的解决方案？
1.原因：这要追溯至 2007 年初。苹果公司在发布首款 iPhone 前夕，遇到一个问题：当时的网站都是为大屏幕设备所设计的。于是苹果的工程师们做了一些约定，应对 iPhone 这种小屏幕浏览桌面端站点的问题。这当中最出名的，当属双击缩放(double tap to zoom)，这也是会有上述 300 毫秒延迟的主要原因。双击缩放，顾名思义，即用手指在屏幕上快速点击两次，iOS 自带的 Safari 浏览器会将网页缩放至原始比例。
2.解决方案
①.粗暴型：禁用缩放
<meta name="viewport" content="width=device-width, user-scalable=no">
这个属于简单粗暴型的，虽然看似完美，但有一个致命的缺陷，当你必须完全禁用缩放来达到目的时候，就傻眼了，只有特定场景下的交互界面，此方案才可行，其它大多数情况，此法都不可行。
另外：Chrome 开发团队不久前宣布，在 Chrome 32 这一版中，他们将在包含 width=device-width 或者置为比 viewport 值更小的页面上禁用双击缩放。当然，没有双击缩放就没有 300 毫秒点击延迟。
②.FastClick：闪亮登场
FastClick是FT Labs专门为解决移动端浏览器 300 毫秒点击延迟问题所开发的一个轻量级的库。简而言之，FastClick 在检测到 touchend 事件的时候，会通过 DOM 自定义事件立即触发一个模拟 click 事件，并把浏览器在 300 毫秒之后真正触发的click事件阻止掉。
FastClick 的使用方法非常简单，引用FastClick.js文件，在 window load 事件之后，在body上调用FastClick.attach()即可。
window.addEventListener( "load", function() { FastClick.attach( document.body );}, false );
attach方法虽可在更具体的元素上调用，直接绑定到body上可以确保整个应用都能受益。当 FastClick 检测到当前页面使用meta设置了user-scalable=no或者 touch-action 属性的解决方案时，会静默退出。可以说，这是真正的跨平台方案出来之前一种很好的变通方案。
就目前而言，FastClick 非常实际地解决 300 毫秒点击延迟的问题，唯一的缺点可能也就是该脚本的文件尺寸 (尽管它只有10kb)。如果你连这10kb都接受不了的话，那么移动端类库 jQuery和zepto.js都支持tap事件来解决这个问题，尽管它们的响应速度比FastClick慢一些。
三、常见浏览器兼容性问题与解决方案？
所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。
浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同
问 题：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。
解决方案：CSS里 *{margin:0;padding:0;}
备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。
浏览器兼容问题二：一个父标签与几个子标签嵌套，父标签不浮动，子标签float，子标签不撑开父的高度。
解决方法：a 在子标签最后清浮动{<div style="height:0;clear:both;"> </div>}
b 父标签添加{overflow：hidden；}
c 给父标签设置高度
浏览器兼容问题三：hack的兼容CSS设置
/* CSS hack*/
写的代码IE不兼容，然后用hack来解决。使用hacker可以把浏览器分为3类：IE6 ；IE7和遨游；其他（IE8 chrome ff safari opera等）
◆IE6认识的hacker 是下划线_ 和星号 *
◆IE7 遨游认识的hacker是星号 *
比如这样一个CSS设置：
2.height:300px;*height:200px;_height:100px;