@H_
301_3@
在CSS3中利用Box-sizing保留了两种盒子模型，当我们设置Box-sizing: content-Box（默认），采用的是W3C标准盒模型，当设置Box-sizing:border-Box时，采用的是IE盒模型。@H_301_3@
5 CSS reset（重置）
@H_
301_3@
每个浏览器都有一些自带的样式，而且各个浏览器这些自带的样式往往又存在不同，这给我们布局上带来了一些不便。因此在实践中往往需要对浏览器的css样式进行“清零”，即CSS reset。最简单的一种reset代码如下：
@H_301_3@
这种方式虽然简单但太过“暴力”，因为很多要素像div、li等本身默认就没有margin、padding样式，这无异于造成大量冗余，更推荐的方式根据自己需要编写reset代码。@H_301_3@
Reference:
6 CSS hack
由于不同的浏览器对CSS的解析和支持是不同的，这会导致相同的CSS代码在不同浏览器中的显示方式并不是完全一致的，这就需要通过CSS Hack来解决不同浏览器的兼容性问题。针对不同浏览器写不同的样式的这个过程就称为CSS hack。
CSS Hack常见的形式有如下几种：
•属性Hack
比如IE6能识别_width以及*width，而在IE7中能识别*width,但是不能识别_width,在FireFox中两个都不识别。
•选择符Hack
比如IE6能识别*html .class{}，IE7能识别*+html .class{}或者*:first-child+html .class{}。
•条件Hack
IE条件注释是微软从IE5开始就提供的一种非标准逻辑语句。比如针对所有IE：
针对IE6及以下版本：
这类Hack不仅对CSS生效，对写在判断语句里面的所有代码都会生效。
Reference
@H_301_3@
7 优雅降级（graceful degradation)与渐进增强(progressive enhancement)
@H_
301_3@
渐进增强指针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。@H_301_3@
优雅降级指一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。@H_301_3@
两者的区别在于优雅降级是从复杂的现状开始，并试图减少用户体验的供给，而渐进增强则是从一个非常基础的，能够起作用的版本开始，并不断扩充，以适应未来环境的需要。降级（功能衰减）意味着往回看；而渐进增强则意味着朝前看，同时保证其根基处于安全地带。@H_301_3@
8 说出遇到的浏览器兼容问题
•不同浏览器中
显示的内边距、外边距不同，如ul
标签在FireFox中默认是有padding值的，而在IE中只有margin有值@H_
301_3@
利用CSS Reset(参见第5条）
•IE6的双倍边距BUG，在块级元素浮动后本来外边距10px,但IE解释为20px@H_301_3@
将其该块级元素display设置为inline
•IE6中不支持min-height@H_301_3@
min-height的作用是作用是当容器的内容较少时，能保持一个最小的高度，以免破坏了布局或UI设计效果。而当容器内的内容增加的时候，容器能够自动的伸展以适应内容的变化。@H_301_3@
通过这种下面的方式可以解决：
@H_301_3@
•在标准的事件绑定中绑定事件的方法函数为addEventListener,而IE使用的是attachEvent@H_301_3@
通过条件判断分别写两条绑定语句或者使用jquery这类web框架库绑定。
•标准浏览器采用事件捕获的方式，而IE采用的是事件冒泡机制@H_301_3@
后来标准认为冒泡更合理，利用设置addEventListener第三个参数兼容两种机制，事件冒泡为默认值。
•事件处理中的event属性IE中获取方式和标准浏览器不同@H_301_3@
标准浏览器是作为参数带入，而ie是window.event方式获得，获得目标元素ie为e.srcElement 标准浏览器为e.target@H_301_3@
Part2 其它
@H_
301_3@
1 了解常用http状态码
@H_
301_3@
200 OK 一切正常，对GET和POST请求的应答文档跟在后面。@H_301_3@
201 Created服务器已经创建了文档，Location头给出了它的URL。@H_301_3@
202 Accepted 已经接受请求，但处理尚未完成。@H_301_3@
304 Not Modified 客户端有缓冲的文档并发出了一个条件性的请求（一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档）。服务器告 诉客户，原来缓冲的文档还可以继续使用。@H_301_3@
400 Bad Request 请求出现语法错误。@H_301_3@
404 Not Found 无法找到指定位置的资源。这也是一个常用的应答。@H_301_3@
405 Method Not Allowed 请求方法（GET、POST、HEAD、DELETE、PUT、TRACE等）对指定的资源不适用。（HTTP 1.1新）@H_301_3@
500 Internal Server Error 服务器遇到了意料不到的情况，不能完成客户的请求。@H_301_3@
502 Bad Gateway 服务器作为网关或者代理时，为了完成请求访问下一个服务器，但该服务器返回了非法的应答。@H_301_3@
2 手写ajax请求
@H_
301_3@
方法
if(window.XMLHttpRequest === undefined){
window.XMLHttpRequest = function(){
try{
return new ActiveXObject("Msxml2.XMLHttp.6.0"); //可用，使用最新ActiveX对象
}
catch(e1){
try{
return new ActiveXObject("Msxml2.XMLHttp.3.0");//不可用，退后更早的版本
}
catch(e2){
throw new Error("XMLHttpRequest is not supported");
}
}
}
}
//get请求
function xhrGet(url,callback){
var request = new XMLHttpRequest();
request.open('GET',url,true);
request.onreadystatechange = function(){
if(request.readyState === 4 && request.status == 200){
callback&&callback(request.responseText);
}
};
request.send(null);
}
//post请求
function xhrPost(url,data,callback){
var request = new XMLHttpRequest();
request.open('POST',true);
request.setRequestHeader('Content-Type','application/json');
request.onreadystatechange = function(){
if(request.readyState === 4 && request.status == 200){
callback&&callback(request);
}
};
request.send(JSON.stringfy(data));
}
这是XMLHttpRequest传统的用法，XMLHttpRequest Level 2提出了很多新的方法，我们常提到的CORS也是源自该方法。@H_301_3@
要了解详细XHR2推荐
3 跨域问题
当我们在页面中通过ajax请求其它服务器的数据时，由于浏览器对于JavaScript的同源策略，客户端就会发生跨域问题。所谓同源策略，指的是一段脚本只能请求来自相同来源（相同域名、端口号、协议）的资源。
如果上面XMLHttpRequest请求的服务地址与当前文件不同源的话，浏览器中会出现如下错误：
那么该如何解决这类跨域问题？
（1）利用CORS跨域
"跨域资源共享"（Cross-origin resource sharing，简称CORS）。CORS是是在XHR2中拓展的能力，使用方法很简单，在服务端设置：
Header set Access-Control-Allow-Origin *
这种设置将接受所有域名的跨域请求，也可以指定具体网址，也可以对域名进行限定：
Header set Access-Control-Allow-Origin @H_301_3@
然而，这种方式的局限性在于要求客户端支持，并且服务端进行相关设置。在这两者满足的情况下，通过CORS进行跨域不仅支持所有类型的HTTP请求，而且开发者可以使用普通的XMLHttpRequest发起请求和获得数据，比起JSONP有更好的错误处理。@H_301_3@
（2）利用JSONP实现跨越@H_301_3@
对于较老的浏览器，它们往往不支持CORS，因此使用JSONP进行跨域也是很常见的一种方式。
我们知道在网页中通过
