《Web网站设计与开发教程》课件第12章.ppt

nodes[1].innerHTML=v1;

nodes[2].innerHTML=v2;

nodes[3].getElementsByTagName(img)[1].src=../images/gx.gif;

v1=encodeURI(encodeURI(v1));

v2=encodeURI(encodeURI(v2));

dataAction(v1,v2,id);

}以上这段JavaScript代码很好地使用了DOM的思想(DOM已在前边章节做过介绍，此处不再进行详细阐述)。也正因为DOM和AJAX技术的出现，JavaScript在前端的表现能力大为提升，很好地丰富了用户体验。

functiondataAction(v1,v2,id){

varxmlhttp=null;

if(window.XMLHttpRequest){//codeforFirefox,Opera,IE7,etc.

xmlhttp=newXMLHttpRequest(); }elseif(window.ActiveXObject){//codeforIE6,IE5

xmlhttp=newActiveXObject(Microsoft.XMLHTTP);

}以上的AJAX代码主要检查了浏览器对于XMLHttpRequest对象的支持情况。由于XMLHttpRequest不是一个W3C标准，所以可以采用多种方法或使用JavaScript来创建XMLHttpRequest的实例。InternetExplorer把XMLHttpRequest实现为一个ActiveX对象，其他浏览器(如Firefox、Safari和Opera)把它实现为一个本地JavaScript对象。由于存在这些差别，JavaScript代码中必须包含有关的逻辑，从而使用ActiveX技术或者本地JavaScript对象技术来创建XMLHttpRequest的一个实例。 if(xmlhttp!=null){

xmlhttp.onreadystatechange=state_Change;

xmlhttp.open(GET,updateColAction?columntitle=+v1+column_desc=

+v2+id=+id+random=+Math.random(),true);

xmlhttp.send(null);

XMLHttpRequest.open方法会建立对服务器的调用，是初始化一个请求的纯脚本方法。它有两个必要的参数，还有三个可选参数，既要提供调用的特定方法(GET、POST或PUT)，还要提供所调用资源的URL。另外还可以传递一个Boolean值，指示这个调用是异步的还是同步的。默认值为true，表示请求本质上是异步的；如果这个参数为false，处理就会等待，直到从服务器返回响应为止。由于异步调用是使用AJAX的主要优势之一，所以倘若将这个参数设置为false，从某种程度上讲与使用XMLHttpRequest对象的初衷不太相符。不过，前面已经说过，在某些情况下这个参数设置为false也是有用的，比如在向后台提交数据之前可以先验证用户的输入。XMLHttpRequest.send方法会具体向服务器发出请求。如果请求声明为异步的，这个方法就会立即返回，否则它会等待直到接收到响应为止。可选参数可以是DOM对象的实例、输入流或者串。输入这个方法的内容会作为请求体的一部分发送。

本节将通过解析新闻网站中所包含验证码功能的设计与实现，让读者更深入地理解Servlet编程。12.6应用Servlet实现验证码12.6.1验证码设计分析

在很多网站的登录界面中都需要用户输入验证码。设置验证码的目的主要是为了防止黑客利用特定的软件不断尝试用户密码以进行破解。

验证码程序的工作机制是在后台生成随机的字符串，并将字符串处理成图像，让用户按照图像所示的字符串进行输入。系统通过对比用户所输入的验证码来决定是否给予用户相应的操作权限。在这个过程中，生成图像的目的就是为了防止用户使用特制软件轻易地对验证码进行破解。在图像上进行一些模糊化处理，可以加大破解图像验证码的难度，提高验证码的可靠性。设计验证码程序的难点主要有两个，即JSP页面如何与Servlet进行交互以及如何对验证码进行图形化处理。虽然也可以通过JSP页面实现验证码的功能，但从验证码的生成和使用方式来考虑，直接