上海网站制作培训,php5+mysql网站开发实例精讲,搜狗网站收录提交入口,如何把刚做的网站被百度抓取到文章目录 目录 文章目录 前言 一.Ajax概述 二.原生创建Ajax 三,使用Jquery处理Ajax 总结 一.Ajax概述 AJAX#xff08;Asynchronous Javascript And XML#xff09;是一种创建交互式网页应用的网页开发技术。它使用Javascript语言与服务器进行异步交互#xff0c;可以传…文章目录 目录 文章目录 前言 一.Ajax概述 二.原生创建Ajax 三,使用Jquery处理Ajax 总结 一.Ajax概述 AJAXAsynchronous Javascript And XML是一种创建交互式网页应用的网页开发技术。它使用Javascript语言与服务器进行异步交互可以传输包括但不仅限于XML格式的数据。其最大的特点在于当服务器响应时无需刷新整个浏览器页面而是可以实现局部刷新。因此用户在使用过程中几乎不会感觉到页面加载或跳转从而提供了更加流畅的用户体验。
与传统的同步交互相比AJAX的异步交互方式允许客户端在发出一个请求后无需等待服务器响应结束就可以发出第二个请求。这大大提升了网页的响应速度和交互性。
在实际应用中AJAX常用于实现搜索自动完成、动态数据更新、实时数据监控等功能。例如在搜索引擎中输入关键字时AJAX技术可以实时显示包含这些关键字的搜索结果而无需用户等待整个页面刷新。
总的来说AJAX是一种非常有效的网页开发技术它通过异步交互和局部刷新的方式极大地提升了网页的交互性和用户体验。但同时也需要开发者注意其可能带来的问题如浏览器的兼容性问题、安全性问题等。 二.原生创建Ajax
创建步骤
创建Ajax对象连接到服务器发送请求接收返回值 !DOCTYPE html
html
headmeta charsetutf-8title/title
/head
bodyinput typebutton idbut1 value读取信息 onclickmyFunction()script typetext/javascriptfunction myFunction() {var oAjax;//第一步创建Ajax对象oAjax new XMLHttpRequest();//第二部连接到服务器oAjax.open(GET, Hello.txt, true);//第三步发送请求oAjax.send();//第四步接收返回值//onreadystatechage指页面与服务器交互时会触发的事件oAjax.onreadystatechange function() {//oAjax.readyState0--请求初始化 1--与服务器连接已建立 2--请求已接收 3--请求处理中 4--请求已完成且响应已就绪//oAjax.status404 未找到页面 200 响应完成if (oAjax.readyState 4 oAjax.status 200) {//oAjax.responseText用于读取数据window.alert(请求成功\n数据 oAjax.responseText);} else {window.alert(请求失败:\noAjax.status \noAjax.readyState oAjax.readyState);}}}/script
/body
/html 三,使用Jquery处理Ajax 总结
