资源描述
AJAX复习题注意:复习提纲中的“参见例子*”的说法,不是照抄例子,需要修改!第一章PPT1. AJAX的全称?Asynchronous JavaScript and XML2. AJAX包含哪些技术?使用XHTML和CSS的基于标准的表示技术 使用DOM进行动态显示和交互 使用XML和XSLT进行数据交换和处理 使用XMLHttpRequest进行异步数据检索 使用Javascript将以上技术融合在一起 3. AJAX的主要特点为Web开发提供异步的数据传输和交换方式,可以在不重载(Reload)刷新(Refresh)页面的情况下与服务器进行数据交换。4. AJAX的异步性表现如下图5. 传统的Web应用程序的同步性如下图6. 在HTML DOM中如何根据id获取页面元素?document . getElementById(*);7. 在JavaScript中,如何定义一个类似于Java中的类?JavaScript中只有function,没有class,用function模拟java中的class,例如:function Book(aname)/既代表Book类定义,也代表Book类的构造函数,有几个属性?有几个类方法?this.name = aname;this.setName = function(bname)this.name = bname;this.getName = function()return this.name;8. 在JavaScript中,如何定义一个如上例的Book类的对象?var book = new Book(“*”);9. 如何用原型化方法在JavaScript中定义一个类似于Java中的类?var Book = function(aname) this.name = aname;Book.prototype.getName =function()return this.name;Book.prototype.setName =function(bname)this.name = bname;Chapter 1. Setup1 如何搭建AJAX应用程序的开发环境?浏览器,JDK,NetBeansChapter 2. JavaScript for Ajax2 CSS样式表由样式规则组成,后缀名是?.css3 样式规则如下所示P color:red; font-size:30px; font-family:隶书;4 在CSS中如何规定类样式?如何在页面中使用类样式?定义: . 类名属性:值;使用: class=“类名”5 什么是id样式?通过标签的id定义样式,定义:#id属性:值;6 如何在Html页面中引用外部样式表style.css?1)使用LINK(链接)标签 :2) 使用import导入: import style.css;7 如何在Html页面中插入页面内css样式? 样式规则 8 将 JavaScript 语句插入 HTML 文档的两种方式7.1 使用 标签将语句嵌入文档, 自己考虑具体例子7.2 将 JavaScript 外部源文件链接到 HTML 文档中,自己考虑具体例子9 写出Html页面的客户端脚本函数sendRequest(), 在该函数中创建XmlHttpRequest请求,向服务器端的某个servlet发送Get请求(该Servlet在web.xml中配置的url为/search), 设置回调函数为myCall( ), 并且传递参数value=“abc”【参见Example 2-2. ajax.js中的function convertToDecimal( ) 】var req;function sendRequest() var url = “/search?value=”abc”; if (window.XMLHttpRequest) req = new XMLHttpRequest( ); else if (window.ActiveXObject) req = new ActiveXObject(Microsoft.XMLHTTP); req.open(Get,url,true); req.onreadystatechange =myCall; req.send(null);10 客户端创建XmlHttpRequest对象,向服务器端发送HTTP异步请求后,在回调函数中由该对象负责获取从服务器端返回的值,所以客户端创建的XmlHttpRequest对象必须放在客户端脚本的全局变量中。11 客户端的回调函数中,常用XmlHttpRequest对象的哪两个属性获取从服务器端传来的值?这两个属性获取的值有什么区别?responseText : 将响应信息作为字符串返回responseXML : 将响应信息格式化为XMLDOM对象并返回12 P9的Table2-1列出了XmlHttpRequest对象的readyState五个值,含义如下readyState 状态 状态说明(0)未初始化 此阶段确认XMLHttpRequest对象是否创建,并为调用open()方法进行未初始化作好准备。值为0表示对象已经存在,否则浏览器会报错对象不存在。 (1)载入此阶段对XMLHttpRequest对象进行初始化,即调用open()方法,根据参数(method,url,true)完成对象状态的设置。并调用send()方法开始向服务端发送请求。值为1表示正在向服务端发送请求。 (2)载入完成此阶段接收服务器端的响应数据。但获得的还只是服务端响应的原始数据,并不能直接在客户端使用。值为2表示已经接收完全部响应数据。并为下一阶段对数据解析作好准备。 (3)交互此阶段解析接收到的服务器端响应数据。即根据服务器端响应头部返回的MIME类型把数据转换成能通过responseBody、responseText或responseXML属性存取的格式,为在客户端调用作好准备。状态3表示正在解析数据。 (4)完成此阶段确认全部数据都已经解析为客户端可用的格式,解析已经完成。值为4表示数据解析完毕,可以通过XMLHttpRequest对象的相应属性取得数据。概而括之,整个XMLHttpRequest对象的生命周期应该包含如下阶段:创建初始化请求发送请求接收数据解析数据完成13 XmlHttpRequest对象的status属性值为200的含义如下Status=200表示http连接状态正常,如果不是200,则表示http连接有误,此时回来的数据也不是我们需要的。14 编写客户端的回调函数myCall( ), 获取从服务器端传来的字符串,并且更新在客户端的div中(中,使用其InnerHtml属性)function myCall()if (req.readyState=4) if (req.status = 200) var logo= document.getElementById(logo); logo.innerHtml=req.responseText; Chapter 3. A Simple Ajax Servlet1 自定义Servlet父类是?需要重载父类的什么方法响应客户端HTTP GET请求?需要重载父类的什么方法响应客户端HTTP POST请求?父类:HttpServlet。重载doGet方法。重载doPost方法。2 doGet和doPost方法中输入参数是什么?(都是两个,注意数据类型)HttpServletRequest requestHttpServletResponse response3 如何客户端发送Get请求,例如传输的查询字符串是value=“abc”, 在doGet中使用什么获取abc这个值?HttpServletRequest的getParameter方法,即request. getParameter(“value”);4 netbeans中创建完自定义的Servlet后,需要在web.xml中自动或者手动配置该自定义Servlet,如下例所示 AjaxResponseServlet ex.AjaxResponseServlet AjaxResponseServlet /AjaxResponseServlet说明红色部分的含义Servlet名字为AjaxResponseServlet,servlet类为ex包中的AjaxResponseServlet类,servlet名字,url映射地址为/AjaxResponseServlet。5:在自定义Servlet的doGet方法中如何向客户端写一个字符串?用代码说明 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException response.setContentType(text/html); response.setHeader(Cache-Control, no-cache); response.getWriter( ).write(“String”); Chapter 4. XML and JSON for Ajax1 当服务器端向客户端传递多个数据时,可以将其包装为什么或者什么传递到客户端?当然如果服务器向客户端传递一个数据时,可使用第三章中的字符串传值。XML或JSON2 Example4-1,服务器端Servlet使用StringBuffer创建XML文档,然后把StringBuffer转换为字符串发还给客户端。查看代码。3 可以使用JDOM,dom4j,SAX简化Servlet创建XML文档的过程,如果使用JDOM,dom4j,SAX,那么在项目中需要导入什么jar包?JDOM: jdom.jarDom4j: dom4j.jarSAX: sax.jar4 假设服务器Servlet创建了一个xml文档,如下所示GeorgeDont forget the meeting!编写Servlet的doGet方法,使用dom4j创建该XML文档,并返回给客户端【参见例子4-3】protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException String dom4jxml= createDom4jXML(); response.setContentType(text/html); response.setHeader(Cache-Control, no-cache); response.getWriter( ).write(dom4jxml);public String createDom4jXML() throws IOException Document document = DocumentHelper.createDocument( ); Element root = document.addElement(note); Element element = root.addElement(to).addText( “George”); element = root.addElement(body).addText( “Dont forget the meeting!”);StringBuffer xmlDoc = null; StringWriter sw = new StringWriter( ); OutputFormat outformat = OutputFormat.createPrettyPrint( ); XMLWriter writer = new XMLWriter(sw, outformat); writer.write(document); writer.close( ); xmlDoc = sw.getBuffer( ); return xmlDoc.toString( );5 假设客户端的浏览器是IE浏览器,编写客户端的回调函数readXml(),取服务器端传来的上例中的XML文档中body子元素的内容,将其填入页面中的单行文本框中( 中【参见例子4-5中的callback()和msPopulate()】funcation readXml()if (req.readyState=4) if (req.status = 200) msPopulate( ); function msPopulate( ) var xmlDoc = req.responseXML;bod = xmlDoc.getElementsByTagName(body); var body = document.getElementById(body); body.value=bod0.firstChild.data; 6 JSON对象相较于XML文档从服务器端传多个值到客户端,有什么优点?JSON对象通常是小于等价的XML文件(在传输同样内容的时候),并使用JSON,内存效率更高JSON可以JavaScript的eval()函数解析JSON对象。不需要其他库,不需要担心跨浏览器。只要您的浏览器启用了JavaScript,并支持eval()函数,能够对数据进行分析。7 简述JSON对象的两种结构:名称值对和数组名称值:对象是一个无序的“名称/值对”集合。一个对象以“”(左括号)开始,“”(右括号)结束。每个“名称”后跟一个“:”(冒号);“名称/值 对”之间使用“,”(逗号)分隔。数组:数组是值(value)的有序集合。一个数组以“”(左中括号)开始,“”(右中括号)结束。值之间使用“,”(逗号)分隔。8 在服务器端可以使用StringBuffer创建JSON对象,也可以使用json_simple.jar简化JSON对象的创建过程,使用json_simple.jar,必须在项目中首先导入该jar包9 编写Servlet的doGet,将4中的XML文档中使用json_simple.ja包装为JSON对象note:to: George,body: Dont forget the meeting! 并发还给客户端【参见例子4-11】public void doGet(HttpServletRequest req, HttpServletResponse res)throws ServletException, IOException res.setContentType(text/xml); res.setHeader(Cache-Control, no-cache); String outString = createJSONwithJSONsimple(); res.getWriter( ).write(outString); public String createJSONwithJSONsimple() JSONObject obj = new JSONObject( ); JSONObject obj2 = new JSONObject( ); obj2.put(to,George);obj2.put(body,Dont forget the meeting! ); obj.put(note,obj2); return(obj.toString( );10:编写客户端的回调函数readJson(),取服务器端传来的上例中的JSON对象中body的值,将其填入页面中的单行文本框中( 中。【参见例子4-12】funcation readJson()var jsonData = req.responseText;var myJSONObject = eval(+jsonData+);var body = document.getElementById(body);body.value = myJSONObject.note.body;Chapter 5. Getting Useful Data1 MySql中建库,在库中建表P442 批量导入数据的命令P45,(mysqlimport,注意在哪里键入该命令)3 在项目中使用Mysql数据库,首先要加入mysql-connector-java-*.*.*-bin.jar包4 编写在服务器端连接数据库,返回一个connection对象的代码。可参见下例Connection con = null; String driver = com.mysql.jdbc.Driver; try Class.forName(driver).newInstance( ); catch (Exception e) System.out.println(Failed to load mySQL driver.); return null; try con = DriverManager.getConnection( jdbc:mysql:/AJAX?user=*&password=*); catch (Exception e) e.printStackTrace( ); return con; 5:编写代码,使用上例中的connection对象,查询数据库,返回结果的代码,可参加下例ResultSet result = null; try Statement select =con. createStatement( );/该con为上例中返回的connection对象result = select.executeQuery(SELECT USERNAME from USERS where USERNAME = + username + ;); /这里可以定义不同的SQL语句,对数据库执行不同的操作,把操作返回的记录们放在结果集中if (result.next( ) ) return true; /查询到记录,返回true,注意代码中判断是否查询到记录的条件,不能用书中的result = null 判断,如果需要读取查询到的每条记录的字段值,不用if,用while循环遍历结果集中每条记录,然后用result.getString(字段名)取每条记录的字段值,最后把你需要的字段值用第四章的内容包装为XML文档或者JSON对象返回给客户端catch (SQLException e) return false; Chapter 6. Ajax Libraries and Toolkits1 常见的简化AJAX中JS代码的AJAX库或者工具包有哪些?The Dojo ToolkitThe Rico ToolkitThe DWR ToolkitScriptaculousPrototype2 Dojo只能简化创建XmlHttpRequest对象的代码,回调函数还是需要自己写。3 Rico可简化创建XmlHttpRequest对象的代码,甚至可以不用写回调函数,实现自动更新。4 使用Dojo工具包,如何在客户端导入Dojo,如何导入并且配置Dojo/只导入 /导入且配置5 使用Dojo工具包,如何简化创建XmlHttpRequest对象的代码?dojo.io.bind( url: *,load:function(type,data,evt) * , error: function(type, data,evt) * , mimetype: text/plain ); 其中url,load,error,mimetype是什么意思?url : 处理请求的urlload : 当响应到达时调用的javascript回调函数error : 错误时调用的javascript函数mimetype : 解析响应6 使用Rico工具包,如何在客户端导入Rico? 7 Rico 提供了一个名叫AjaxEngine的JavaScript对象,使用RICO,服务器端返回的必须是固定格式的XML文档。8 使用AjaxEngine创建AJAX应用分为哪三步?a) 注册一个Ajax请求。i. 在AjaxEngine中为某个XmlHttp请求指定一个名字 /代码示例:ajaxEngine.registerRequest(zipRequestHandle, rico); 两个参数一个是请求的别名,第二个是该请求发送时,用来指定服务器端某个应用程序的url,显然这里的字符串rico必须在web.xml中和服务器端的某个servlet联系在一起b) 注册一个Ajax响应。i. 在AjaxEngine为响应处理对象(两类)进行注册1. 可以是一个作为数据返回目的的HTML元素 /代码示例ajaxEngine.registerAjaxElement(cityDiv); cityDiv是html的某个div标签的id值,注册了这个div标签为AJAX响应,则不需要写回调函数,服务器端返回值自动写入到div标签中2. 或者是某个指定的、将用于处理响应的JavaScript对象。 /代码示例:首先参见example6-2,首先在客户端创建一个JS自定义类,然后使用原型方法,添加该类的方法,关键是ajaxUpdate方法(服务器响应会自动触发该方法,完成更新),最后创建一个该类的JS对象(参见example6-2的最后一句);/创建完6-2的JS对象后,注册该对象,代码示例:AjaxEgine.registerAjaxObject(“locationUpdate”,cityStateUpdate),第一个参数是对象别名,第二个参数是6-2中创建的JS对象c) 发送Ajax请求。/代码示例: 发送Get请求,ajaxEngine.sendRequest(zipRequestHandle, zip=+escape(this.value),第一个参数是注册的请求别名,第二个参数是查询字符串/在客户端页面注册完请求和响应后,在页面HTML标签的事件响应属性中发送AJAX请求,不需要写繁琐的JS代码,就可以完成AJAX应用了。9 Rico中如果注册的响应是HTML标签,写出服务器端返回的XML文档 some content for the city some content for the state 其中根元素必须是什么?返回的数据必须包含在什么子元素里面,该子元素的type属性必须是什么,id值的含义是什么?some content for the city会自动更新到客户端的哪里?必须包含在里,type属性必须是element,id为Html中注册的标签的id,自动更新到id为cityDiv的标签内。10 Rico中如果注册的响应是JS对象,写出服务器端返回的XML文档 其中根元素必须是什么?返回的数据必须包含在什么子元素里面,该子元素的type属性必须是什么?id值的含义是把该response子元素返回给哪个客户端已注册的JS对象,自动触发该对象的ajaxUpdate方法完成自动更新。必须包含在里,type属性必须是object Chapter 7. Ajax Tags1 自定义标签是在Tag Library Definition 文档中定义的,它的后缀名是什么?.tld2 TLD文档的结构是什么?(ex7-1) zipCode /com.oreilly.ajax.ZipCodeTag /标明自己写的自定义标签处理类是什么empty stateId true 每个元素的含义是什么?Taglib :标签库Tag:定义一个标签Name:标签的名字Tagclass:标签处理类Attribute:标签属性Tag元素必须有的子元素是什么?name和tagclass3 如何在JSP页面中使用AJAX标签?(ex7-2) /导入已经定义好的TLD文档 /按照TLD文档中的规定,加入自定义标签zipcode,自定义标签用属性值和页面其他标签联系在一起。比如zipcodeid属性值是zipcode,正好是页面中某个单行文本框的id值。 因为标签处理类只能获取自定义标签的属性,这样的联系让标签处理类间接获取页面中的其他标签(或者其他内容),可以完成我们想要的工作。注意自定义标签并不显示在页面上4 自定义标签处理类的父类是什么?(ex7-3)javax.servlet.jsp.tagext.TagSupport5 3中自定义标签包含4个属性,它的标签处理类必须拥有4个同名属性6 JSP页面读到自定义标签 的开始标记时,会自动调用标签处理类(ex7-3)的doStartTag( )方法,同样标签处理类的doEndTag( )在JSP页面执行到自定义标签的结束标记时被调用。所以我们的自定义标签处理类通常需要编写doStartTag( ), doEndTag( )两个方法
展开阅读全文