Ajax(Asynchronous JavaScript XML)不是单一的技术，而是四种技术的集全。
JavaScript
JavaScript是通用的脚本语言，用来嵌入在某种应用之中。Web浏览器中嵌入的JavaScript解释器允许通过程序与浏览器的很多内建功能进行交互。Ajax应用程序是使用JavaScript编写的。
JavaScript毫无疑关是Ajax工具箱中的核心技术。Ajax应用程序完全下载到客户端的内存中。由数据、表现和程序逻辑三者组成，JavaScript就是用来实现逻辑的工具。JavaScript是一种混合了多种编程思想的通用编程语言，提供了一个表面上与C系列语言相似的语法接口。
JaavaScript可以简短地描述为一种弱类型的、解释型的通用的脚本语言。弱类型（looselytyped）意味着变量不需要明确声明为字符串、整数或者对象，同一个变量可以使用不同的类型来赋值。解释型（interpreted）意味着不需要编译，源代码本身就可以直接执行。将源代码放在Web服务器上，通过因特网传输到用户的浏览器中，JavaScript应用的部署就完成了。此外，在javaScript中，甚至还可以在运行时对一小段代码进行求值。通用（general purpose）意味着这种语言适用于大部分的算法和编程任务。JavaScript语言核心支持数字、字符串、日期和时间、数组、用于处理文本的正则表达式，以及数学函数（例如三角运算、随机数生成等）。JavaScript还支持定义结构化的对象，因此可以使用面向对象的设计原则来建造列加复杂的代码。
CSS 层叠样式表
CSS为Web页面元素提供了一中可重用的可视化样式的定义方法。它提供了简单而又强大的方法，以一致的方式定义和使用可视化样式。在Ajax应用中，用户界面的样式可以通过CSS独立修改。
CSS样式为一个文档定义显示规则，通常放在一个单独的文件中，由应用这些样式的Web页面来引用。当然，也可以在Web页面中定义样式规则，但这通常是一种很糟糕的做法。
一个样式规则由两部分组成：选择器（selector）和样式声明（style declaration）。选择器表明要为哪一个元素设置样式，样式声明则表明要应用哪些样式属性。
DOM 文档对象模型
DOM以一组可以使用JavaScript操作的可编程对象展现出Web页面的结构。通过使用脚本修改DOM，Ajax应用程序可以在运行时改变用户界面，或者高效地重绘页面中的某个部分。
DOM能够为JavaScript引擎公开文档。通过使用DOM，可以采用编程方式操作文档的结构。当编写Ajax应用时，这是一种特别有用的能力。在传统Web应用中，我们通常使用来自服务器的亲的HTML流来刷新整个页面，并通过提供新的HTML来重新定义用户界面。而在Ajax应用中，用户界面的更新主要是使用DOM来完成的。Web页面中的HTML标签被组织成一个树状结构。树的根节点是<HTML>标签，它代表这个文档。在它内部的<BODY>标签代表文档的主体部分，是可见的文档结构的根节点。在文档主体之内，有表格、段落、列表以及其他的标签类型，每个标签之中还可以有其他标签。
Web页面的DOM表示也是一个树状结构，由元素或节点组成，节点还可能包含很多的子节点。JavaScript引擎通过全局变量document公开当前Web页面的根节点，这个变量是所有DOM操作的起点。DOM元素通过W3C规约来定义。它有一个父元素，没有或者有多个子元素，有任意多个作为关联数组来存储的属性（也就是说，使用width或style这样的文本形式的键，而不是使用数字索引）。
XMLHttpRequest 对象
XMLHttpRequest对象允许Web程序员从Web服务器以后台活动的方式获取数据。数据格式通常是XML，但是也可以很好地支持任何基于文本的数据格式。尽管XMLHttpRequest对于完成这件工作来说是最为灵活和通用的工具，但还有其他方法也可以从服务器获取数据。
XmlDocument和XMLHttpRequest对象并不是Web浏览器中DOM的标准扩展，它们只是碰巧得到了多数浏览器的支持。它们的设计目标很明确，就是用来以后台方式获取数据，这使得发出异步调用的业务使用起来非常流畅。两个对象都是源自微软私有的ActiveX组件，可以在IE浏览器中作为JavaScript对象来访问。其他的浏览器依照相似的功能和API调用实现了自已的原生对象。两个对象执行的功能很相似，不过XMLHttpRequest可以更加精细地对请求进行控制。
一个XmlDocument对象的跨平台创建
function getXmlDocument(){
var dom = null;
//Mozilla浏览器/Safari浏览器
if(document.implementation && document.implementation.createDocument){
dom = document.implementation.createDocument("","",null);
}
//IE浏览器
else if(typeof ActiveXObject != "undefined"){
try{
//较新版本的IE浏览器
dom = new ActiveXObject("Msxml2.DOMDocument");
}catch(e){
//较老版本的IE浏览器
dom = new ActiveXObject("Msxml.DOMDocument");
}
}
if(dom == null || typeof dom.load == "undefined"){
dom = null;
}
return dom;
}
检查浏览器的厂商和版本号信息，并且使用这些信息来开发用于不同浏览器的分支代码，是一种很常见的做法，在我们看来，这种做法容易导致错误，因为它无法预期浏览器的未来版本，并且未还会将有能力执行这段脚本的排除在外。在getXmlDocument()函数中，我们没有尽力去猜测浏览器的版本，而是直接检查特定的对象是否可用。这个方法也称作对象检测（object detection），可以更容易地支抚育浏览器未来的版本，以及那些我们没有时确测试过的不常见浏览器，通常这会使得代码更加健壮。
一个XMLHttpRequest对象的跨平台创建对象的跨平台创建
function getXMLHttpRequest(){
var request = null;
//Mozilla浏览器/Safari浏览器
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
}
//IE浏览器
else if(typeof ActiveXObject != "undefined"){
request = new ActiveXObject("Microsoft.XMLHTTP");
}
return request;
}
没有评论:
发表评论