ajax解决常遇到问题

前端之家收集整理的这篇文章主要介绍了ajax解决常遇到问题前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

.ajax自我介绍

AJAX =Asy@H_403_16@nchronousJavaScript and XML (异步的@H_403_16@javaScript @H_403_16@XML).AJAX 不是新的编程语言,而是一种使用现有标准的新方法.AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下,通过在后台与服务器进行少量数据交换,使网页实现异步更新.是一种用于创建快速动态网页的技术.

Ajax 主要是由下面几个部分组成:

1.基于标准的XHTML结构和CSS 样式.

2.通过DOM(Document Object Model) 实现动态显示和交互.

3.通过XML XSLT 进行数据交换和处理.

4.通过XMLHttpRequest 插件进行异步通信.

5.使用javaScript 实施逻辑控制,以便整合以上所有的技术.

所谓异步请求,就是浏览器不必等待HTTP响应完毕才继续执行,而是立即执行javascript 命令或用户请求,也就是说,HTTP请求与浏览器操作不是同步的.而是在同步请求下,浏览器只有在响应完毕之后,才能继续执行后续任务或操作.

一个Aja@H_403_16@x解决方案中涉及的技术有以下四个方面@H_403_16@:

1.JavaScript,通过用户或其他与浏览器相关事件捕获交互作用.

2.XMLHttp@H_403_16@Request对象@H_403_16@,通过这个对象可以在不中断其他浏览器任务的情况下向服务器发送请求@H_403_16@.

3.服务器上的XML文件,或者其他类似的数据格式.

4.其他Java@H_403_16@Script,解决来自服务器的数据并将其呈现到页面@H_403_16@.

.Ajax解决问题

在一个优秀的HTML 网页中,总会伴有javascript@H_403_16@,jquery,ajax 这三姐妹@H_403_16@,jquery@H_403_16@javascript 的一个函数@H_403_16@,做最少的功干最多的事情@H_403_16@.不是所有的事情@H_403_16@jquery 都能解决@H_403_16@,这是@H_403_16@ajax 的出现@H_403_16@,就是解决简单的@H_403_16@javascript无法解决的事情@H_403_16@.那么我们来看看@H_403_16@ajax 经常解决的一些问题@H_403_16@.

@H_403_16@

1.解决浏览器缓存问题

浏览器缓存(Bro@H_403_16@wser Caching)是为了加速浏览@H_403_16@,浏览器在用户磁盘上对最近请求过的文档进行存储@H_403_16@,当访问者再次请求这个页面@H_403_16@,浏览器就可以从本地磁盘显示文档@H_403_16@,这样就可以加速页面的阅览@H_403_16@.

缓存的方式节约了网络的资源,提高了网络的效率,但是对于某些需要统计访问量 的网站,缓存问题却称为了最让人头疼的问题的了,那么使用Ajax@H_403_16@ 如何解决这个问题@H_403_16@.其实 解决方法就是增加时间戳.关键的代码如下:

if(url.indexOf("?")>=0){
     url=url+"&t="+(new Date()).valueOf();
}
else{
   url=url+"?+"+(new Date()).valueOf();
}

2.解决中文乱码问题

出现中文乱码的两种情况:

(1).请求数据中包含中文,服务器程序接收错误导致出现乱码.

(2).响应数据中包含中文,编码设置错误导致浏览器中看到的结果数据是乱码.

响应数据乱码的解决方法:保证页面端定义的char@H_403_16@set@H_403_16@http响应头的@H_403_16@Content-Type中定义的@H_403_16@charset一致即可@H_403_16@.

解决中文响应数据出现乱码有两种方法:

(1).http响应头的Cont@H_403_16@ent-Type中的@H_403_16@charset设置为@H_403_16@utf-8l

(2).仅仅用"MSXML2.XMLHTTP","Miscrosoft.XMLHTTP"这两个中的一个来创建XMLHttpRequest对象

那么解决中文乱码问题的原理是:



3.解决跨域访问问题

IE6:默认访问跨域页面时会给出提示,用户确认后会访问.

IE7以上.Mozi@H_403_16@lla FireFox及其他@H_403_16@,默认不允许访问跨域页面

跨域问题的图解如下:



从上图可以看出,可以从页面端和服务器端解决跨域问题.

页面:

If(url.indexOf("http://")==0){
  url=url.replace("?","&");
  url="Proxy?url="+url;
}

服务器端

Get@H_403_16@ @H_403_16@Post 方式分开处理

(1).获取原始的请求url地址和参数

(2)get方式利用URL 和远程地址交互

(3)post方式利用URLURLConn@H_403_16@ection和远程地址交互@H_403_16@,还要向远程发送请求参数信息

4.解决空白问题

HTML文档body的子孙节点或XML根节点的子孙节点中,如果两个元素节点之间只有空格,缩进,回车这样的不包含文字信息的内容,那这些信息就都是空白信息.

解决空白信息这个问题的方法就是采用深度遍历的方式进行遍历,移除所有空白信息,保证IEFi@H_403_16@reFox下的@H_403_16@dom树结构相同@H_403_16@.

Function removeBlank(doc){
  if(doc.childNodes.length>1){
     for(var loopIndex=0.loopIndex<doc.childNodes.length;loopIndex++){
       var currentNode=doc.childNodes[loopIndex];
       if(currentNode.nodeType==1){
            removeBlank(currentNode);
        }
       if(((/^\s+$/.test(currentNode.nodeValue)))&&(currentNode.nodeType==3)){
           doc.removeChild(doc.childNodes[loopIndex--]);
       }
      }
  }
}
把我们在html 网页设计中常遇到的四个问题整理了一下,希望在的html设计中,对你有帮助.

猜你在找的Ajax相关文章