AJAX w3school and JS code compatibility considerations for IE, Firefox, Chrome

AJAX instance

http://www.w3school.com.cn/example/ajax_examples.asp

AJAX - server response

server response

To get a response from the server, use the responseText or responseXML properties of the XMLHttpRequest object.

Property description
responseText Get response data as a string.
responseXML Get the response data in XML.

responseText property

http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_response.asp

If the response from the server is not XML, use the responseText property.

The responseText property returns the response as a string, so you can use it like this:

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

AJAX ResponseXML instance

http://www.w3school.com.cn/ajax/ajax_responsexml.asp

Unlike responseText, which returns the HTTP response as a string, responseXML returns the response as XML.

The ResponseXML property returns an XML document object that can be inspected and parsed using the methods and properties of the W3C DOM node tree.

===========================

 

 

     JS Code Compatibility Notes for IE, Firefox, and Chrome

Reprinted from:

http://www.alonely.com.cn/Firefox/20161003/48172.html

 

    近日,公司的线软件产品由于用户原来越多并广受好评,公司决定由原来只支持IE,扩展到支持Firefox 和 Chrome,随身版更决定使用Chrome作为客户端,在代码兼容性升级的时候,碰到一些问题,姑且记录下来,供同事和朋友们参考。

1.  IE 的XMLHTTP 如果申请一个非XML格式的文件,XMLHttpObject.responseXML 是一个可用的对象。
     Firefox 和 Chrome 则会返回null
     IE我们可以直接 XMLHttpObject.responseXML.loadXML, Firefox 和 Chrome 要通过其他方法 
  1. 	var xmlHttp=getXMLHttpObj();   
    	var text = xmlHttp.responseText.replaceAll('&','&');   
    	var xD=xmlHttp.responseXML;   
    	if(xD){   
    		xD.loadXML(text);   
    	}else{   
    		var oParser = new DOMParser();   
    		xD= oParser.parseFromString(text,"text/xml");   
    		//alert(xD.getElementsByTagName("a"));   
    	}
     
2. 还是XMLHttpObject , IE 和 Chrome 可以 支持 XMLHttpObject.send() 方法里面没有任何参数,Firefox 必须要求最少都要一个参数,即使参数值为null ,即:  
  1. //要兼容多种浏览器,必须这样写,参数null不能省略:   
  2. XMLHttpObject.send(null);  
     

 

3.Firefox 里面 HTMLElementObject.outerHTML 属性无效,IE和Chrome 就很正常,例如我们要删除一个DIV:  
  1. // 这一句在IE和Chrome 运行很好   
  2.     $("DIV").outerHTML="";  //删除一个DIV   
  3. //firefox 不能则通过上面的语句实现,只能通过以下方法实现    
  4. $("DIV").parentNode.removeChild($("DIV"));   
  5. delete $("DIV"+n);  

 

4. Firfox 不支持直接用HTMLElementObject 的id 取得该元素,IE和Chrome 则支持得很好。
    Firfox死板的坚持“标准”?!
    例如我们页面上有这样一段HTML代码:  
  1.  <div id="DivObj">this is some text</div>  
     IE和Chrome 可以直接用DivObj 就可以引用这个元素对象。
     Firfox 就在只能用 getElementById('DivObj') 或者著名的$('DivObj')函数了

5. javascript 操作styleSheet对象和rules对象,兼容的写法如下:      
  1. var Rules=document.getElementById("xwincss").sheet||document.styleSheets["xwincss"];   
    if(Rules.rules){   
      //IE   
       Rules=Rules.rules;   
    }else{   
      //firefox   
       Rules=Rules.cssRules;   
    }  
       
6、firefox和ie事件event处理 
在ie中,事件对象是作为一个全局变量来保存和维护的。 所有的浏览器事件,不管是用户触发 
的,还是其他事件, 都会更新window.event 对象。 所以在代码中,只要轻松调用 window.event 
就可以轻松获取 事件对象, 再 event.srcElement 就可以取得触发事件的元素进行进一步处理 
在ff中, 事件对象却不是全局对象,一般情况下,是现场发生,现场使用,ff把事件对象自动传 
递给对应的事件处理函数。 在代码中,函数的第一个参数就是ff下的事件对象了。 
 
  1. //<button id="btn4" onclick="foo4()">按钮4</button>    
    function foo4(){    
    var evt=getEvent();    
    var element=evt.srcElement || evt.target ;    
    alert(element.id)    
    }    
    function getEvent()    
    { //同时兼容ie和ff的写法    
    if(document.all) return window.event;    
    func=getEvent.caller;    
    while(func!=null){    
    var arg0=func.arguments[0];    
    if(arg0){    
    if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){    
    return arg0;    
    }    
    }    
    func=func.caller;    
    }    
    return null;    
    }  
       

7. Firefox and ie are not compatible with 
the hand pointer cursor. There are two ways of writing cursor: hand and cursor: pointer, among which cursor: hand is not supported in ff, and an error is returned! 
Just use cursor: pointer, ff and ie All support! 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=326487326&siteId=291194637