AJax技术

ajax XMLHttpRequest详解(2)

字号+ 作者:H5之家 来源:H5之家 2017-07-29 10:02 我要评论( )

******************************/ /*******************************标准XMLHttpRequest属性********************** onreadystatechange:每个状态改变时都会触发这个事件处理器,通常会调用一个JavaScript函数。 re


******************************/
/*******************************标准XMLHttpRequest属性**********************
onreadystatechange:每个状态改变时都会触发这个事件处理器,通常会调用一个JavaScript函数。
readyState:请求的状态。有5个可取值:0 = 未初始化,1 = 正在加载, 2 = 已加载, 3 = 交互中, 4 = 完成。
responseText:服务器的响应,表示为一个串。
responseXML:服务器的响应,表示为XML。这个对象可以解析为一个DOM对象。
status:服务器的HTTP状态码(200对应OK,404对应Not Found(未找到),等等).
statusText:HTTP状态码的相应文本(OK或Not Found(未找到)等等)。
***************************************************************************
*/

/*********************来看看到底要怎么才能发送请求*******
使用XMLHttpRequest对象发送请求的基本步骤如下:
1.得到XMLHttpRequest对象实例的一个引用,为此,可以创建一个新的实例,也可以访问包含有
XMLHttpRequest实例的一个变量。
2.告诉XMLHttpRequest对象,哪个函数会处理XMLHttpRequest对象状态的改变。为此要把对象的
onreadystatechange属性设置为指向一个JavaScript函数的指针。
3. 指定请求的属性。XMLHttpRequest对象的open()方法会指定将发出的请求。open()方法取3个
参数:一个是指示所用方法(通常是GET或POST)的串,另一个是表示目标资源URL的串,还有一
个Boolean值,指示请求是否是异步的。
4. 将请求发送给服务器。XMLHttpRequest对象的send()方法会把请求传送到指定的目标资源。
send()方法接受一个参数,这通常是一个串或一个DOM对象。这个参数会作为请求体的一部分传送到
目标URL.向send()方法提供参数时,要确保open()中指定的方法是POST。如果没有数据要作为请求体
的一部分发送,则使用null。

异步方式给用户带来的体验:(我想程序员看到这段解释,心里真的很爽!)
对服务器的请求是异步发送的,因此浏览器可以继续响应用户输入,并在后台等待服务器的响应。
如果选择同步操作,而且倘若服务器的响应要花好几秒才能到达,浏览器就会表现得很迟钝,在
等待期间不能响应用户的输入。这样一来,浏览器好像被冻住一样,无法响应用户输入,而异步
做法可以避免这种情况,从而让最终用户有更好的体验,尽管这种改善很细微,但确实很有意义。
这样用户就能继续工作,而且服务器会在后台处理先前的请求。能与服务器通信而不打断用户的
工作流,这样就可以采用很多技术来改善用户体验。例如,假设有一个验证用户输入的应用。用
户在输入表单上填写各个域时,浏览器可以定期地向服务器发送表单值来进行验证,此时并不打
断用户,他还可以继续填写余下的表单域。如果某个验证规则失败,用户会立即得到通知,而不
必等表单真正发送到服务器进行处理时才知道有错误,这就能大大节省用户的时间,也能减轻服
务器上的负载压力,因为不必在表单提交不成功时完全重建表单的内容。

下面是说明安全问题的:
XMLHttpRequest对象要受制于浏览器的安全“沙箱”。XMLHttpRequest对象请求的所有资源
都必须与调用脚本在同一个域(domain)内。这个安全限制使得XMLHttpRequest对象不能请
求脚本所在域之外的资源。这个安全限制的强度如何因浏览器而异(见图2-5)。Internet Explorer
会显示一个警告,指出可能存在一个安全风险,但是用户可以选择是否继续发出请求。Firefox则
会断然停止请求,并在JavaScript控制台显示一个错误消息。Firefox确实提供了一些JavaScript技巧,
使得XMLHttpRequest也可以请求外部URL的资源。不过,由于这些技术针对特定的浏览器,最好不要用,
而且要避免使用XMLHttpRequest访问外部URL

var date = new Date();
date.getYear(); //获取当前年份(2位)
date.getFullYear(); //获取完整的年份(4位,1970-????)
date.getMonth(); //获取当前月份(0-11,0代表1月)
date.getDate(); //获取当前日(1-31)
date.getDay(); //获取当前星期X(0-6,0代表星期天)
date.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)
date.getHours(); //获取当前小时数(0-23)
date.getMinutes(); //获取当前分钟数(0-59)
date.getSeconds(); //获取当前秒数(0-59)
date.getMilliseconds(); //获取当前毫秒数(0-999)
date.toLocaleDateString(); //获取当前日期
var time=date.toLocaleTimeString(); //获取当前时间
date.toLocaleString( ); //获取日期与时间

 

<script language="网页特效" type="text/javascript">
       function ShowTime() {
           document.getElementById("time").innerHTML = new Date().toLocaleTimeString(); //获取当前系统时间
           setTimeout("ShowTime()", 1000);//设置定时刷新 一秒更新一次
       }
       function DateDemo() {
           var d, day = "";  //声明变量
           d = new Date(); //创建Date对象
           var week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
           day += d.getFullYear() + "年";     //获取年份
           day += (d.getMonth() + 1) + "月"; //获取月份
           day += d.getDate() + "日";        //获取日
           day += week[d.getDay()];
           document.getElementById("time").title = day;
       }
       ShowTime(); DateDemo();
   </script>

<span id="time"></span>

 

相关函数

function getMainHead() {

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • AJAX请求 $.ajaxSetup方法的使用:设置AJAX请求的默认参数选项,当程序中需要发起多个AJAX请求时,则不

    AJAX请求 $.ajaxSetup方法的使用:设置AJAX请求的默认参数选项,当程

    2017-07-29 10:07

  • php+ajax+json的一个最简单实例

    php+ajax+json的一个最简单实例

    2017-07-29 09:00

  • 【AJAX框架开发技巧】

    【AJAX框架开发技巧】

    2017-07-28 13:06

  • Ajax如何实现局部刷新

    Ajax如何实现局部刷新

    2017-07-28 12:03

网友点评