AJAX学习笔记
=---------------------------------------------==---------------------------------------------=
现状: DHTML基础 (JavascriptCSSHTMLDOM)
参考书: 《 Foundations of AJAX 》《AJAX In Action》
(AJAX基础,AJAX实战,两本书的中文版都可以在图书馆借到(大学城),电子书目前只知道有E文版下载)
=---------------------------------------------=
=---------------------------------------------=
AJAX: 异步JAVASCRIPT+XML (Asynchronous Javascript XML)
1,AJAX是客户端技术
2,与AJAX同时出现的最频繁的字眼是:“用户体验”
3,学AJAX所要学的“新”东西是: XMLHTTPRequest
一个最简单的AJAX封装应用:
(注意,必须要放在服务器目录下,不能本地访问)
xhrclass.js
/**
* class XmlHTTPRequest
*
* 这个是我浏览完Foundations of AJAX后写的一个HTTPRequest封装
*
*
*
*
*
*
*
*
*
**/
function xhrclass(method,url,asyn,callback){
var m_method=method;
var m_url=url;
var m_asyn=asyn;
this.xhrcallback=callback;
this.startXHR=function(){
this.creatXHR();
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
this.xhrcallback();
}
}
}
try{
xhr.open(m_method,m_url,m_asyn);
}catch(e){
alert("cannot open");
}
if(m_method=="POST"){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
if (xhr.overrideMimeType) {
xhr.overrideMimeType('text/xml');
}
if(xhr==null)
alert("cannot create xhr");
};
this.creatXHR=function(){
if(window.ActiveXObject)
xhr=new ActiveXObject("Microsoft.XMLHTTP");
else
xhr=new XMLHttpRequest();
};
this.sendit=function(t){
xhr.send(t);
};
this.getText=function(){
var ret;
try{
ret=xhr.responseText;
}catch(e){
alert("xhr.responseText wrong!");
}
return ret;
};
this.getXML=function(){
return xhr.respon***ML;
}
}
使用例子:
test.htm
<script language="javascript" src="xhrclass.js"></script>
<script language="javascript">
function xhrcallback(){
alert(xhr1.getText());
}
function showIntro(teacherid){
//未做兼容处理
try{
创建xhrclass实例
xhr1=new xhrclass("GET","TEST.xml",true,xhrcallback);
}catch(e){
alert("cannot create class");
}
//启动xmlHTTPRequest接接
xhr1.startXHR();
xhr1.sendit(null);
}
</script>
<div id="a"></div>
<table>
<tr>
<td onmouseover="javascript:showIntro();" >把鼠标放在上面!</td>
</tr>
</table>
test.xml
这个文件可以是php文件,如此例可写为:<?PHP echo("This is from server"); ?>
this is from server
原帖由 iptton 于 2006-11-1 13:07 发表
AJAX基础,AJAX实战,两本书的中文版都可以在图书馆借到(大学城)
是不是都给你借了?我没有看到AJAX实战这本啊!
不过算了,应该没有时间看了.
应该不只是一本吧,我借了一本时记得还有的。。。建议去二楼查下。。。
-----------by Iptton
[ 本帖最后由 iptton 于 2006-11-1 22:37 编辑 ] GMail 上的XMLRequest兼容性应该很强的了。。。
function SendJS(url) {
var xhr;
try {
xhr = new XMLHttpRequest();
} catch (e) {
var a = ['MSXML2.XMLHTTP.5.0', 'MSXML2.XMLHTTP.4.0',
'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'MICROSOFT.XMLHTTP.1.0',
'MICROSOFT.XMLHTTP.1', 'MICROSOFT.XMLHTTP'];
for (var i = 0; i < a.length; i++) {
try {
xhr = new ActiveXObject(a);
break;
} catch (e) {
}
}
}
if (xhr) {
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
var data = '&js=' + encodeURIComponent(top.js.document.body.innerHTML);
xhr.send(data);
}
}
页:
[1]