AJAX介绍
　　AJAX 关键词：
　　javascript脚本和可扩展标记语言(XML) 
　　WEB浏览器技术 
　　开放式WEB标准 
　　浏览器以及独立平台 
　　更好更快的网络应用程序 
　　XML以及HTTP请求 
　　AJAX = 异步JavaScript和可扩展标记语言
　　AJAX是一种运用JavaScript和可扩展标记语言(XML)，在网络浏览器和服务器之间传送或接受数据的技术。
　　AJAX是一种浏览器技术
　　AJAX是一种运用于浏览器中的技术。在浏览器和服务器之间，它使用异步数据进行转换，并允许网页向服务器索取少量信息而非整个网页。
　　这项技术标志着网络应用程序的微小化、迅捷化以及便捷化。
　　AJAX是一种不需依靠服务器软件而独立运做的浏览器技术。
　　AJAX是基于公共标准的
　　AJAX基于以下一些公共标准：
　　XML 可扩展标记语言 
　　HTML 超文本标记语言 
　　CSS 层叠样式表 
　　运用于ALAX的公共标准被很好的定义并且得到一些主要的常用浏览器支持。ALAX应用程序是独立的浏览器和平台（交互平台，交互浏览器技术）。
　　AJAX事关更好的网络应用程序
　　网络应用程序比单机应用程序有更多的好处，它能符合更多用户的需求，更易安装且方便支持和扩展。
　　然而，网络应用程序并非总是像单机应用程序一样好使唤。
　　而运用AJAX，网络应用程序将变地更实用（更小、更快、更易于使用）。
　　今天就开始使用AJAX吧！
　　无需学习新的知识。
　　AJAX是基于公共标准的。这些标准已经被大多数开发人员使用多年。
　　大多数现存的网络应用程序可以用AJAX进行重新编写以取代传统的超文本标记语言方式。
　　AJAX使用可扩展语言和HTTP请求
　　传统的网络应用程序会将输入的信息提交给服务器（使用HTML表单）。在服务器通过代码后，将会把一个全新的完整的页面传送给用户。
　　由于用户每次提交输入信息的时候服务器都将传回一个新的页面，传统的网络应用程序通常运行缓慢且使用不便。
　　使用AJAX，网页应用程序能不经重新下载整个网页就发送并重新获得数据。这是通过发送HTTP请求和使用JS对网页进行部分修改来实现的。
　　联系服务器的较好的方式是发送像可扩展标记语言这样的数据（其他的方法也可以采用）。
　　你将在这篇引论的下一章节更多地了解到这一切是如何做到的。

　　AJAX实例
　　AJAX可以用来创建更多交互式的网络应用程序。
　　AJAX 实例
　　在以下的AJAX范例中，我们将了解到当用户以网页格式输入数据时一个网页是如何与网络服务器连接的。 
　　在下面的框中输入姓名 *实际操作请前往W3Schools
First Name:  
Suggestions: 
　　实例解析-超文本标记语言模式
　　以上的范例所含超文本标记语言代码如下： 
<form> 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form><p>Suggestions: <span id="txtHint"></span></p> 
　　就如你看到的，它只是一个普通的表单，里面有一称为"txt1"的输入框
　　下一段包括了一个称做“txtHint”的SPAN。这个SPAN是用来存储从服务器重新获得的信息的。
　　当用户输入数据，名为“showHint()”的函数将被执行。这个函数的执行是由“onkeyup”事件触发的。换种说法：每当用户在txt1区域内触动键盘按钮，showHint的功能就被执行。
　　实例解析- showHint()函数
　　showHint()函数是一种位于HTML顶端的简单的JS函数。
　　函数包含以下代码：
function showHint(str)
{ 
if (str.length > 0)
{ 
var url="gethint.asp?sid="+Math.random()+"&q="+str
xmlHttp=GetXmlHttpObject(stateChanged) 
xmlHttp.open("GET", url , true) 
xmlHttp.send(null) 
} 
else
{ 
document.getElementById("txtHint").innerHTML="" 
} 
}
　　每当有字符被键入输入区内就会执行这个函数
　　如有字符被输入文字输入区(str.length>0)函数就执行：
　　建立一个XMLHTTP对象 
　　发送一个HTTP请求到服务器上的"gethint.asp"上 
　　当HTTP触发一次变动则XMLHTTP对象就会执行stateChanged()函数 
　　实例解析 - stateChanged()函数
　　stateChanged()函数包含以下代码：
function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{ 
document.getElementById("txtHint").inne

评论 (0) All

登陆 还没注册？