尚硅谷-佟刚-Ajax教材.ppt

JSON 小结 优点： 作为一种数据传输格式，JSON 与 XML 很相似，但是它更加灵巧。 JSON 不需要从服务器端发送含有特定内容类型的首部信息。 缺点： 语法过于严谨 代码不易读 eval 函数存在风险 解析 HTML HTML 由一些普通文本组成。如果服务器通过 XMLHttpRequest 发送 HTML， 文本将存储在 responseText 属性中。 不必从 responseText 属性中读取数据。它已经是希望的格式，可以直接将它插入到页面中。 插入 HTML 代码最简单的方法是更新这个元素的 innerHTML 属性。 HTML 小结 优点： 从服务器端发送的 HTML 代码在浏览器端不需要用 JavaScript 进行解析。 HTML 的可读性好。 HTML 代码块与 innerHTML 属性搭配，效率高。 缺点： 若需要通过 AJAX 更新一篇文档的多个部分，HTML 不合适 innerHTML 并非 DOM 标准。 对比小结 若应用程序不需要与其他应用程序共享数据的时候, 使用 HTML 片段来返回数据时最简单的 如果数据需要重用, JSON 文件是个不错的选择, 其在性能和文件大小方面有优势 当远程应用程序未知时, XML 文档是首选, 因为 XML 是 web 服务领域的 “世界语” jQuery 中的 Ajax jQuery 对 Ajax 操作进行了封装, 在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post(), 第三层是 $.getScript() 和 $.getJSON() load() 方法 load() 方法是 jQuery 中最为简单和常用的 Ajax 方法, 能载入远程的 HTML 代码并插入到 DOM 中. 它的结构是: load(url[, data][,callback]) 程序员只需要使用 jQuery 选择器为 HTML 片段指定目标位置, 然后将要加载的文件的 url 做为参数传递给 load() 方法即可 load() 方法 ---- 细节 如果只需要加载目标 HTML 页面内的某些元素, 则可以通过 load() 方法的 URL 参数来达到目的. 通过 URL 参数指定选择符, 就可以方便的从加载过来的 HTML 文档中选出所需要的内容. load() 方法的 URL 参数的语法结构为 “url selector”(注意: url 和 选择器之间有一个空格) 传递方式: load() 方法的传递参数根据参数 data 来自动自定. 如果没有参数传递, 采用 GET 方式传递, 否则采用 POST 方式 对于必须在加载完才能继续的操作, load() 方法提供了回调函数, 该函数有三个参数: 代表请求返回内容的 data; 代表请求状态的 textStatus 对象和 XMLHttpRequest 对象 $.get() (或$.post()) 方法 $.get() 方法使用 GET 方式来进行异步请求. 它的结构是: $.get(url[, data][, callback][, type]); $.get() 方法的回调函数只有两个参数: data 代表返回的内容, 可以是 XML 文档, JSON 文件, HTML 片段等; textstatus 代表请求状态, 其值可能为: succuss, error, notmodify, timeout 4 种. $.get() 和 $.post() 方法时 jQuery 中的全局函数, 而 find() 等方法都是对 jQuery 对象进行操作的方法 $.get() (或$.post()) 方法应用 序列化元素 jQuery 为准备 “发送到服务器的 key/value 数据” 提供了一个简化的方法: serialize(). 该方法作用于一个 jQuery 对象, 能将 DOM 元素内容序列化为字符串, 用于 Ajax 请求. 使用 serialize() 方法可以自动完成对参数的 url 编码 因为该方法作用于 jQuery 对象, 所以不光只要表单能使用, 其它选择器选取的元素也能使用它. 验证日期 进行日期验证(包括格式和闰二月)，用输入日期后，通过 onchange 事件给出相应的提示信息 输入错误日期后的页面及提示信息 获取焦点之后 输入正确日期后的页面及提示信息 输入空格之后 验证日期 日期验证的关键： Java 正则表达式类： java.util.regex.Pattern JAVA日期验证 正则表达式,包括润二月： 验证 Email 练习：把 email 作为注册用户名。需验证其格式的正确和在数据