这两天闲着没事,看了一些自己以前写的js代码,对创建XmlHttpRequest核心对象的js写法产生了兴趣,原先只知道针对不同浏览器,创建XHR对象的方法不同,但一直没有进行系统的整理和阐述。现将网上查到的和我自己整理的列举如下:
通常,在我的ASP.NET程序中,我通常这样创建XHR对象:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
Code
var xmlHttp;
function createXMLHttpRequest()
{
if (window.ActiveXObject) //IE浏览器
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) //Mozilia浏览器
{
xmlHttp = new XMLHttpRequest();
}
}
从上面我们可以知道,目前主要针对浏览器内核的不同,采取不同的方式创建XHR对象。
对于IE浏览器,Microsoft 浏览器 Internet Explorer 使用 MSXML 解析器处理 XML。因此如果编写的 Ajax 应用程序要和 Internet Explorer 打交道,那么必须用一种特殊的方式创建对象。方法如下:
var xmlHttp = false;
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
} catch (e)
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} catch (e2)
{
xmlHttp = false;
}
}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
而对于非IE内核浏览器,需要使用不同的代码。事实上就是如下所示的简单代码:
var xmlHttp = new XMLHttpRequest();
这行简单得多的代码在 Mozilla、Firefox、Safari、Opera 以及基本上所有以任何形式或方式支持 Ajax 的非 Microsoft 浏览器中,创建了 XMLHttpRequest 对象。
后来发现,我这个写法是最基础的,而XMLHTTP组件这几年又随着OS的更新而不断升级,推出了很多新的版本。在我的TopMapTest项目中,我找到我原来用过的一个xmlextra.js封装的脚本库发现,在这个功能类中,也提供了对不同浏览器创建XHR对象的扩展,其内容为:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
Code
//<script>
//////////////////
// Helper Stuff //
//////////////////
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
// used to find the Automation server name
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
function getDomDocumentPrefix()
{
if (getDomDocumentPrefix.prefix)
return getDomDocumentPrefix.prefix;
var prefixes = ["MSXML2", "Microsoft", "MSXML", "MSXML3"];
var o;
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
for (var i = 0; i < prefixes.length; i++)
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
// try to create the objects
o = new ActiveXObject(prefixes[i] + ".DomDocument");
return getDomDocumentPrefix.prefix = prefixes[i];
}
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
catch (ex)
{};
}
throw new Error("Could not find an installed XML parser");
}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
function getXmlHttpPrefix()
{
if (getXmlHttpPrefix.prefix)
return getXmlHttpPrefix.prefix;
var prefixes = ["MSXML2", "Microsoft", "MSXML", "MSXML3"];
var o;
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
for (var i = 0; i < prefixes.length; i++)
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
// try to create the objects
o = new ActiveXObject(prefixes[i] + ".XmlHttp");
return getXmlHttpPrefix.prefix = prefixes[i];
}
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
catch (ex)
{};
}
throw new Error("Could not find an installed XML parser");
}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
//////////////////////////
// Start the Real stuff //
//////////////////////////
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
// XmlHttp factory
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
function XmlHttp()
{}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
XmlHttp.create = function ()
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if (window.XMLHttpRequest)
{
var req = new XMLHttpRequest();
// some versions of Moz do not support the readyState property
// and the onreadystate event so we patch it!
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if (req.readyState == null)
{
req.readyState = 1;
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
req.addEventListener("load", function ()
{
req.readyState = 4;
if (typeof req.onreadystatechange == "function")
req.onreadystatechange();
}, false);
}
return req;
}
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if (window.ActiveXObject)
{
return new ActiveXObject(getXmlHttpPrefix() + ".XmlHttp");
}
}
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
catch (ex)
{}
// fell through
throw new Error("Your browser does not support XmlHttp objects");
};
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
// XmlDocument factory
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
function XmlDocument()
{}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
XmlDocument.create = function ()
{
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
// DOM2
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if (document.implementation && document.implementation.createDocument)
{
var doc = document.implementation.createDocument("", "", null);
// some versions of Moz do not support the readyState property
// and the onreadystate event so we patch it!
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if (doc.readyState == null)
{
doc.readyState = 1;
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
doc.addEventListener("load", function ()
{
doc.readyState = 4;
if (typeof doc.onreadystatechange == "function")
doc.onreadystatechange();
}, false);
}
return doc;
}
if (window.ActiveXObject)
return new ActiveXObject(getDomDocumentPrefix() + ".DomDocument");
}
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
catch (ex)
{}
throw new Error("Your browser does not support XmlDocument objects");
};
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
// Create the loadXML method and xml getter for Mozilla
if (window.DOMParser &&
window.XMLSerializer &&
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
window.Node && Node.prototype && Node.prototype.__defineGetter__)
{
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
// XMLDocument did not extend the Document interface in some versions
// of Mozilla. Extend both!
XMLDocument.prototype.loadXML =
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
Document.prototype.loadXML = function (s)
{
// parse the string to a new doc
var doc2 = (new DOMParser()).parseFromString(s, "text/xml");
// remove all initial children
while (this.hasChildNodes())
this.removeChild(this.lastChild);
// insert and import nodes
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
for (var i = 0; i < doc2.childNodes.length; i++)
{
this.appendChild(this.importNode(doc2.childNodes[i], true));
}
};
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
/**//*
* xml getter
*
* This serializes the DOM tree to an XML String
*
* Usage: var sXml = oNode.xml
*
*/
// XMLDocument did not extend the Document interface in some versions
// of Mozilla. Extend both!
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
XMLDocument.prototype.__defineGetter__("xml", function ()
{
return (new XMLSerializer()).serializeToString(this);
});
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
Document.prototype.__defineGetter__("xml", function ()
{
return (new XMLSerializer()).serializeToString(this);
});
}
在上面的getXmlHttpPrefix()方法中,我们发现["MSXML2", "Microsoft", "MSXML", "MSXML3"];所指定的4个前缀,在创建IE浏览器支持的XHR对象时,提供了不同的创建方法。但如果要在代码中,换一种方式来写,应该如何写呢?这几种前缀+".XMLHttp"所创建的对象分别有什么区别呢?所以在网上查了一下,关于这方面的内容还蛮多,特将部分内容记录:
片断1:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
Code
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
/**//*****************************************************************************************
Object CreateHTTPPoster(void)
创建尽可能高版本的XMLHTTP对象
*****************************************************************************************/
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
function CreateHTTPPoster()
{
if(window.XMLHttpRequest) return new XMLHttpRequest();
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
try
{
return new ActiveXObject('MSXML2.XMLHTTP.4.0');
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}catch(e)
{try
{
return new ActiveXObject('MSXML2.XMLHTTP.3.0');
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}catch(e)
{try
{
return new ActiveXObject('MSXML2.XMLHTTP.2.6');
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}catch(e)
{try
{
return new ActiveXObject('MSXML2.XMLHTTP');
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}catch(e)
{try
{
return new ActiveXObject('Microsoft.XMLHTTP');
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}catch(e)
{return null;}}}}}
}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
片断2:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
Code
function CreateHTTP()
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
{
if (window.XMLHttpRequest) return(new XMLHttpRequest());
var arr_t = new Array
(
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP.2.6",
"Microsoft.XMLHTTP",
"MSXML.XMLHTTP"
);
for (var i=0; i<arr_t.length; i++)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
try
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
return(new ActiveXObject(arr_t[i]));
}
catch(e)
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
}
}
return(null);
}
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
上面两个代码基本写法类似,都是通过调用较高版本的XMLHTTP对象,按顺序创建较高版本的XMLHTTP对象。在我们使用XMLHTTP时,要优先使用较高版本的XHR对象,现在已经升级到5.0版本了new ActiveXObject("Msxml2.XMLHTTP.5.0")。
至于究竟这些不同版本的XMLHTTP对象有何区别,我们可以参考以下文章:
http://eric-2007.javaeye.com/blog/338731