硕士研究生毕业学位论文设计范文模板参考资料基于bs模式运用ajax技术的南通女子监狱绩效考核系统的设计与实现

硕士研究生毕业学位论文设计范文模板参考资料基于bs模式运用ajax技术的南通女子监狱绩效考核系统的设计与实现内容摘要：

过程，在用户交互模型上应尽可能地直接参照传统 Web 应用和桌面应用程序，为了让用户免于重新投入时间和精力去学习和习惯新交互模式，开发人员不应过分关注和浪费时间去发明不熟悉的交互模型。 4) 可访问性：充分考虑主要用户的需求和喜好的同 时也不能闭门造车，将没有预料到的新用户拒之门外。 要充分考虑到用户是否会使用老版本的浏览器或特定的软件，以制定相应的措施。 5) 避免下载整个页面：当最初的页面下载之后，所有与服务器的通信都交由Ajax 引擎管理。 避免一些地方通过 Ajax 来完成少量数据的下载，而在另一些地方却仍需重新下载整个页面，这种做法会对用户的体验造成破坏。 Ajax 以提高 Web 可用性和用户体验为出发点，在实践中坚持上述几个原则有助于保证 Ajax 应用的有效性和可用性。 常见的 Ajax 应用 Ajax 的特点在于异步交互，动态更新 Web 页 面，因此它更适合交互较多，频繁读取数据的 Web 应用。 现在来看几个常见的 Ajax 的应用实例。 数据验证 在填写表单内容时，需要保证数据的唯一性（例如新用户注册填写的用户名），因此必须对用户输入的内容进行数据验证。 通常是在提交表单后在服务器进行验证，不仅时间长而且造成了服务器不必要的负担。 而使用 Ajax 技术，可以由XMLHttpRequest 对象发出验证请求，根据返回的 Http 响应判断验证是否成功，整个过程不需要弹出新窗口，也不需要将整个页面提交到服务器，快速而又不加重服务器的负担。 按需取数据 分类树或者树形结构通常将分类结果中的数据一次性读取出来并写入数组，然后根据用户的操作，用 JavaScript 来控制节点的呈现。 应用 Ajax 初始化页面时，只获取第一级子分类的数据并且显示；当用户点开一级分类的第一节点时，页面会通过 Ajax 向服务器请求当前分类所属的二级子分类的所有数据；以此类推。 页面会根据用户的操作向服务器请求它所需要的数据，这样就不会存在数据冗余，减少数扬州大学硕士学位论文 12 据下载总量。 同时，更新页面时不需要重载所有内容，只更新需要更新的那部分内容即可，相对于以前后台处理并且重载的方式， 大大缩短了用户等待时间。 自动更新页面 通常在聊天室等需要经常刷新数据的页面中，可以在页面加载以后，通过 Ajax引擎在后台进行定时的轮询，向服务器发送请求，查看是否有最新的消息。 如果有则将新的数据（而不是所有的数据）下载并且在页面上进行动态的更新，通过一定的方式通知用户。 这样既避免了用户不断手工刷新页面的不便，也不会因为重复刷新页面造成资源浪费。 Ajax 的重要组成技术 Ajax 涉及到了 JavaScript、 XHTML 和 CSS、 DOM、 XML 和 XSTL、XMLHttpRequest 等技术，其中 JavaScript， DOM， XML， XMLHttpRequest 比较有用 [13]。 下面就主要介绍一下这四种技术： JavaScript JavaScript 是一种由 Netscape 的 LiveScript 发展而来的脚本语言，主要目的是为了解决服务器终端语言遗留的速度问题 [14]。 是适应动态网页制作的需要而诞生的一种新的编程语言。 JavaScript 短小精悍 ， 又是在客户机上执行的，大大提高了网页的浏览速度和交互能力。 JavaScript 使网页增加互动性。 JavaScript 使有 规律地重复的 HTML 文段简化，减少下载时间。 JavaScript 能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间 而是 交由 CGI 验证。 JavaScript 一直被定位为客户端的脚本语言，应用最多的地方是表单数据的校验。 现在，可以通过 JavaScript 操作 XMLHttpRequest，来跟数据库打交道。 DOM DOM（ Document Object Model，文档对象模型）是由 W3C 制定的一种独立于平台和具体编程语言的 API 接口标准 [15]。 一般来说，支持 JavaScript 的 所有浏览器都支持 DOM，例如 Web 浏览器 DOM 规定：通过 Document 对象的 forms[]数组可以访问 HTML 文档中的表单。 本论文所涉及的 DOM，是指 W3C 定义的标准的文档对象模型，它以树状结构表示 HTML/XHTML 文档，并定义了遍历这个树和检查、 13 修改树节点的方法和属性。 该标准的其他部分为文档的各个节点定义了事件处理程序、使用文档的样式和操作文档邻接范围的方法。 DOM 还可以用来表示 XML 文档，其语法比 HTML 文档的语法复杂的多。 这类文档的树状结构表示包含表示 XML 实体引用节点、表示处理指令的节点以及表示 CDATA 段的节点。 XML XML 是 Extended Markup Language 的缩写。 它是互联网联合组织 ( W3C,World Wide Web Consortium)于 1998 年初制定的一种新的数据描述语言，用于描述数据文档中数据的组织和安排结构 [16]。 在 XML 文档中，用户可以定义自己需要的标记，创造自己的标记语言，只要在定义标记时遵循 XML 规范。 XML 定义了一套元句法，这些符合规范的 XML 文档能够被应用程序很容易地统一解析。 这种数据存储和传输就有章可循。 XML 由于简洁高效，能 够用纯文本的形式表现各种复杂的有层次的数据及其之间的相互关系，易于在各个平台上构造和解析，因此在数据交换、结构化数据存储与显示、内容呈现与显示格式分离等方面得到了广泛的应用。 Ajax 核心技术 —— XMLHttpRequest 对象 XML HttpRequest 对象是 Ajax 技术的核心，没有 XML HttpRequest 对象就相当于没有 Ajax，它是 Ajax 的最重要的一个对象。 XML HttpRequest 是 XMLHTTP 组件的对象，通过这个对象， Ajax 可以像桌面应用程序一样只同服务器进行 数据层面的交换 ,而不用每次都刷新界面，也不用每次将数据处理的工作都交给服务器来做 :这样既减轻了服务器负担又加快了响应速度、缩短了用户等待的时间 [17]。 XMLHttpRequest 对象是由 JavaScript 创建并使用，客户端可以只从服务器端获取需要的信息，通过与 DOM 和 CSS 的结合，可以实现局部刷新，同时还可以通过XMLHttpRequest 对象异步提交信息，将输入的数据在后台提交到服务器而无需刷新页面。 组合这些技术可以做出强大的应用，典型的代表是 GoogleMaps 和 GoogleSuggest。 正是对 XMLHttpRequest 对象的成功应用，催生了 Ajax 的概念。 XMLHttpRequest 提供了一系列属性和方法来向服务器发送异步的 HTTP 请求。 在服务器处理用户请求的过程中，它监听服务器的状态，并根据这些状态指示JavaScript 做相应的处理。 当服务器顺利完成响应用户行为的动作、并将响应数据扬州大学硕士学位论文 14 返回时， XMLHttpRequest 对象能够回调响应的处理函数。 它提供的 Response 系列方法，可以将这些响应数据以文本、 XMLDocument 对象、 AdoStream 对象或者 Unsignedbyte 数组的方式组装起来，由 JavaScript 操纵 DOM 更新 Web 页面内容。 异步通信对于 Ajax 应用来说是非常重要的。 通过异步通信可以完成很多传统Web 开发不能完成的功能， XMLHttpRequest 对象的应用就体现在这里。 图 24 显示了 XMLHttpRequest 对象在 Ajax 开发中的应用。 XMLHttpRequest对象是基础设施，是整个 Ajax 开发的基础。 表 21 XMLHttpRequest 对象的方法 方法 描述 abort() 停止当前请求 getAllResponseHeaders() 作为字符串返问完整的 headers getResponseHeader(headerLabel) 作为字符串返问单个的 header 标签 open(method,URL[,asyncFlag[,userName[,password]]]) 建立到服务器的新请求 send(content) 发送请求 setRequestHeader(label, value) 设置 header 并和请求一起发送 从 开始，开发人员可以在 Web 页面内部 使用 XMLHTTP ActiveX 组件扩展自身的功能，不用从当前的 Web 页面导航就可以直接传输数据到服务器或者从服务器接收数据 [18]。 Mozilla 以及 NetScape 7 则是创建继承 XML 的代理类XMLHttpRequest；对于大多数情况， XMLHttpRequest 对象和 XMLHTTP 组件很相似，方法和属性类似，只是部分属性不同。 表 21 和表 22 给出将要用于该对象的服务器端程序 访问接口 客户端页面 XML HttpRequest Ajax 应用逻辑 图 24 XML HttpRequest 对象的作用 15 几个方法和属性。 表 22 XMLHttpRequest 对象的属性 属性 描述 onreadystatechange 状态改 变的事件触发器 readyState 对象状态 (integer): 0 = 未初始化 1 = 读取中 2 = 已读取 3 = 交互中 4 = 完成 responseText 服务器进程返回数据的文本版本 responseXML 服务器进程返回数据的兼容 DOM 的 XML 文档对象 status 服务器返回的状态码： 如： 404 = 文件末找到 、 200 =成功 statusText 服务器返回的状态文本信息 Ajax 的生命周期 为了能使作为 Web 应用程序一部分的 Ajax 的生命周期更像桌面系统的 GUI，而 DOM 则扮演了类似 GUI 控件的角色。 JavaScript 脚本对 DOM 注册事件监听，操作响应事件。 在响应事件的过程中， Web 服务器可能被调用。 这个调用是异步进行的，所以事件监听阶段和事件响应阶段是分开的。 下面是一个典型的浏览器中 Ajax 应用的生命周期。 1) 用户访问：用户访问一个网站，比如点击链接或者在浏览器中输入网站的URL 地址。 2) 页面初始化：页面初始化加载，准备处理用户输入或者刷新页面内容。 3) 触发浏览器事件：浏览器触发一个事件，比如鼠标单击或者按下键盘。 4) 向服务器发 起请求：浏览器向服务器发出一个请求。 5) 服务器响应请求：服务器响应浏览器发出的请求，将处理结果返回。 这个返回结果传递给在发出请求时指定的请求调用函数。 6) 浏览器更新页面：请求调用函数根据响应结果更新 DOM 内容，比如 DOM变量或者任何 JavaScript 变量，更新页面内容。 “触发浏览器事件→向服务器发起请求→服务器处理请求→服务器响应请求→浏览器更新页面”这个过程是可以多次循环的，如图 25 所示。 在循环过程中通常会有很多的变量产生，很多事件也可能在客户端解决而不提扬州大学硕士学位论文 16 用户访问 页面初始化 触 发 浏览 器 事件 向 服 务器 发 起请求 服务器处理请求 服 务 器响 应 请求 浏 览 器更 新 页面 循环 图 25 Ajax的生命周期 交到服务器。 有些 Ajax 应用的生命周期可能是 短暂的，随着用户提交表单或者重新刷新页面而结束。 其他则持续呈现在浏览器上（用户不重新刷新页面，也不提交表单），一直响应用户的行为。 Ajax 应用程序的开发过程 通过上述分析，结合 Ajax 的生命周期，可以 形成一个发送和接收XMLHttpRequest 请求的程序框架。 Ajax 实质上也是遵循 Request/Server 模式，所以这个框架基本的流程也是：对象初始化→发送请求→服务器接收→服务器返回→客户端接收→修改客户端页面内容。 只不过这个过程是异步的。 初始化 XMLHttpRequest 对象 为了让 JavaScript 可以向服务器发送 HTTP 请求，必须使用 XMLHttpRequest对象 ,使用之前，要先将 XMLHttpRequest 对象实例化 [19]。 之前说过，各个浏览器对这个实例化过程实现不同。 IE 以 ActiveX 控件的形式提供，而 Mozilla 等浏览器则直接以 XMLHttpRequest 类的形式提供。 为了让编写的程序能够跨浏览器运行，要这样写： if() //Mozilla,Safari { _request = new XMLHttpRequest()。 } else if() //IE { _request = new ActiveXObject。