1、 AJAX 兼容问题
创建xmlhttprequest对象的兼容,各浏览器不同。从IE5开始支持ajax。
MSXML2.XMLHttp、MSXML2.XMLHttp.3.0、MSXML2.XMLHttp.6.0。//适用于IE7之前的版本
XMLHttpRequest适用于IE7及更高版本的 IE7+、Firfox、Opear、Chorme、Safari都支持原生的XHR对象
函数实现:
function createXHR(){
----------if(typeof XMLHttpRequest === "undefined"){
----------XMLHttpRequest = function (){
----------try{return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
---------
catch(e){
--------------------try{return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
-----------------------catch(e){
--------------------------try{return new ActiveXObject("Msxml2.XMLHTTP");}
----------}}}}
----------return new XMLHttpRequest();
-}
或者
var request;
----if(window.XMLHttpRequest){
---------reques=new XMLHttpRequest();
//IE7 Firefox chorm Opear Safrai
----}
----else{
---------request=new ActiveXObject("Microsoft.XMLHTTP"); //IE6 或者IE5
----}
2、 跨源兼容问题
function createCORSRequst(method,url){
-----var xhr=new XMLHttpRequest(); //可访问status状态
-----if("withCredentials" in xhr){
---------xhr.open(method,url,true);
-----}
-----else if(XDomainRequest){ //IE 异步 只能改头部的content-Type字段。不能查看响应状态码,不知是成功。cookie不会发送 用 .onload函数
-----xhr=new XDomainRequest();
-----xhr.open(method,url);
-----}
-----else{
------xhr = null;
------}
------return xhr;
}
var request=createCORSRequest("get","http://www.somwhere.com/page/");
if(request){
------request.οnlοad=function(){
------//dell
-------}
-------request.send();
}
3、事件兼容问题
var EventUtil = {
-----addHandler: function(element,type,handler){
------------if(element.addEventListener){
//dom2 添加事件addEventListener
------------------element.addEventListener(type,handler,false);
------------}else if(element.attachEvent){ //IE模式添加事件attachEvent
------------------element.attachEvent("on"+type,handler);
------------}else{
------------------element["on"+type]=handler; //dom0添加事件 .on+type
------------}
-----},
-----removeHandler: function(element,type,handler){
------------if(element.removeEventListener){
------------------element.removeEventListener(type,handler,false);
------------}else if(element.detachEvent){
------------------element.detachEvent("on"+type,handler);
------------}else{
------------------element["on"+type]=null;
------------}
-----}
getEvent: function(event){
return event?event : window.event;
}
getTarget : function(){
return event.target || event.srcElement
}
};
4、布局盒模型兼容问题
ie56789可能都会有border,要设置为0才行。
ie5 不能使文字向下对齐
ie的a里面如果有div的话鼠标选上去不会变成小手的样子
垂直居中:
5、js兼容问题
火狐不支持innerTEXT但是支持innerHTML。支持textContent。并且觉得浏览器加载html比text快。