AJAX入门教程

Java私塾《AJAX开发初步》 ——深入浅出系列精品教程 n 学习AJAX开发初步，达到能基本使用AJAX进行开发应用 n 第一章：AJAX开发基础知识 包括：是什么、能干什么、有什么，XMLHttpRequest对象的初始化、属性、方法 和基本使用 n 第二章：AJAX的HelloWorld 包括基本的使用方法，用AJAX实现数据校验 n 第三章：AJAX实现下拉列 表 关于同志近三年现实表现材料材料类招标技术评分表图表与交易pdf视力表打印pdf用图表说话 pdf 联动 n 第四章：AJAX结合XML的操作 包括AJAX读取xml文档、AJAX上传xml数据、AJAX获取XML数据并处理 《深入浅出学AJAX开发初步》——系列精品教程 真正高质量培训 签订就业 协议 离婚协议模板下载合伙人协议 下载渠道分销协议免费下载敬业协议下载授课协议下载 网 址：http://www.javass.cn 咨询QQ：460190900 课程概览 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 第一章：AJAX开发基础知识 《深入浅出学AJAX开发初步》——系列精品教程 n AJAX是什么 AJAX是“Asynchronous Javascript And Xml”的首字母简写，表示：异步 Javascript和Xml。 AJAX是一种在网络应用中实现异步通讯和数据交换的技术。其实是多种技术 的综合，包括：Javascript、XHTML、CSS、XML、DOM、XSLT和XMLHttpRequest等 技术。没有提出AJAX的时候，上述技术只是单独使用，有了AJAX的时候，他们就 可以协作起来，实现更多的功能。 事实上，AJAX并没有新技术，其实是把一堆的老技术进行整合，焕发出新的 青春，实现新的功能而以。 n AJAX能干什么 AJAX能干的事情很多，最基本的有以下几条： 1：无刷新更新页面 2：按需获取数据，减轻服务器负担 3：可以实现富客户端 4：基于 标准 excel标准偏差excel标准偏差函数exl标准差函数国标检验抽样标准表免费下载红头文件格式标准下载 化和广泛使用的技术 5：进一步实现页面和逻辑相分离 6：使用户获得连续的、动态的体验 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-1 《深入浅出学AJAX开发初步》——系列精品教程 n AJAX有什么 AJAX就是由上面提到的那一堆技术的集合，其中XMLHttpRequest就是AJAX 用来实现异步通讯的核心技术，下面就重点说说XMLHttpRequest： 1：如何初始化XMLHttpRequest对象 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-2 《深入浅出学AJAX开发初步》——系列精品教程 2：XMLHttpRequest对象的属性 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-3 《深入浅出学AJAX开发初步》——系列精品教程 3：XMLHttpRequest对象的方法 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-4 《深入浅出学AJAX开发初步》——系列精品教程 4：指定响应处理函数（回调函数） myRequest.onreadystatechange = t2; function t2(){ 。。。。。。} 5：发出Http请求 myRequest.open("GET","b.jsp?id="+userId,true); myRequest.send(null); open的第一个参数：是HTTP请求的方法，Get、Post或Head open的第二个参数：是目标URL，只能是当前应用内的URL open的第三个参数：指定在等待服务器返回信息的时间内是否继续执行下面的代 码，如果为true，则会继续执行，默认是true 调用完open后，接着调用send方法，真正的提交。如果需要传递文件的话，需要先 调用setRequestHeader方法，修改MIME类别，如下： myRequest.setRequestHeader(“Content-Type”,”application/msexcel”); 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-5 《深入浅出学AJAX开发初步》——系列精品教程 6：处理服务器返回的信息 首先根据XMLHttpRequest的readyState的值，然后获取值，如果是文本的话，通 过responseText来获取，如下： if(myRequest.readyState==4){ var ret = myRequest.responseText; //接下来处理返回的值，主要使用Javascript } 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 认识AJAX-6 《深入浅出学AJAX开发初步》——系列精品教程 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 第二章：AJAX开发HelloWorld 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> 新用户注册
用户编号：*
用户姓名：*
真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 AJAX请求页面-2 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> <% String id = request.getParameter("id"); if(id!=null && id.trim().length()>0 && id.indexOf("cc")<0){ out.println("ID---OK"); }else{ out.println("OD---Failed"); } %> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 AJAX响应页面 《深入浅出学AJAX开发初步》——系列精品教程 通过HelloWorld，我们很容易看出来 1：AJAX的本质：只是一个异步通讯技术，传什么，传到过后怎么办都不属于 AJAX处理，它只是负责传输。所以AJAX的编程模型和学过的IO的编程模型基 本一样 2：Javascript负责在传输前准备数据，Javascript可以直接从HTML的Dom中获 取数据，然后组织成后台需要的格式 3：当从后台返回数据后，也是由Javascript负责解析数据，并把数据重新设置 回Html组件上显示 4：来回传递的数据可以是普通文本，也可以是XML，如果不是很有必要的话， 建议还是使用普通文本，速度快，处理起来也方便。 5：HelloWorld就是典型的数据校验功能的基本实现 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 HelloWorld总结 《深入浅出学AJAX开发初步》——系列精品教程 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 第三章：典型应用——下拉列表联动 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 AJAX请求页面-2 《深入浅出学AJAX开发初步》——系列精品教程 新用户注册
所在省份： bjcity shcity sdcity
所在市区： cy hd
真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 AJAX请求页面-3 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> <% String id = request.getParameter("id"); if(id!=null && id.equals("bj")){ out.println("cy,cyq|hd,hdq"); }else if(id!=null && id.equals("sh")){ out.println("pd,pdq|xh,xhq|px,pxq"); }else if(id!=null && id.equals("sd")){ out.println("qd,qds|yt,yts"); } %> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 AJAX响应页面 《深入浅出学AJAX开发初步》——系列精品教程 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 第四章：典型应用——操作xml 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 直接读取xml的AJAX请求页面-2 《深入浅出学AJAX开发初步》——系列精品教程 Programmer 32768 Sales 70000 CEO 100000 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 被读取的xml 《深入浅出学AJAX开发初步》——系列精品教程 跟直接读取xml的AJAX页面一样，只是在处理返回的数据的时候，修改成如下： 原来： var returnObj = http_request.responseXML; var xmlobj = http_request.responseXML; 修改成： var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async=false; xmlDoc.loadXML(http_request.responseText); var returnObj = xmlDoc; var xmlobj = xmlDoc; 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 后台返回xml数据的AJAX请求页面 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> <% StringBuffer buffer = new StringBuffer(""); buffer.append(""); buffer.append("Programmer32768< /employees>"); out.print(buffer.toString()); %> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 后台返回xml数据的AJAX响应页面 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 向后台发送xml的AJAX请求页面 《深入浅出学AJAX开发初步》——系列精品教程 <%@ page contentType="text/html; charset=gb2312"%> <%@ page import="java.io.*" %> <%@ page import="javax.xml.parsers.*" %> <%@ page import="javax.xml.transform.*" %> <%@ page import="org.w3c.dom.*" %> <% DocumentBuilderFactory bdf = DocumentBuilderFactory.newInstance(); DocumentBuilder db = bdf.newDocumentBuilder(); Document doc = db.parse(request.getInputStream()); doc.normalize(); NodeList employees = doc.getElementsByTagName("employee"); for (int i = 0; i < employees.getLength(); i++) { Element employee = (Element) employees.item(i); System.out.println(" content: "); System.out.println(" name= "+ employee.getAttribute("name")); System.out.println(" job= "+ employee.getElementsByTagName("job").item(0) .getFirstChild().getNodeValue()); } out.println("get xml is ok!"); %> 真正高质量培训 签订就业协议 网 址：http://www.javass.cn 咨询QQ：460190900 向后台发送xml的AJAX响应页面 《深入浅出学AJAX开发初步》——系列精品教程