本帖最后由 小鲁哥哥 于 2017-11-2 09:20 编辑
『黑马程序员济南』JavaEE就业笔记串讲--Ajax和JQuery AJAX的概述： 什么是AJAX: * AJAX:异步的 JavaScript And XML. * 使用的是老的技术,用的是新的思想. 了解同步和异步的区别: * 参考图一: AJAX的功能:完成页面的局部刷新,不中断用户的体验. * 早期的时候JS技术根本不受重视.后台开发人员经常将JS当成一种玩具式语言.JS中有一个对象XMLHttpRequest对象可以向服务器异步发送请求.传统的B/S结构的软件,所有实现功能都需要在服务器端编写代码(胖服务器).现在有了AJAX以后,可以将部分代码写到客户端浏览器(RIA:Rich InternetApplication).FLEX:AS脚本编程. * XML:使用XML做为数据传递的格式: JSON: XMLHttpRequest 属性: * readyState :XMLHttpRequest的状态 * onreadystatechange :当XMLHttpRequest状态改变的时候触发一个函数. * status :获得响应的状态码. 200 , 404 ... * responseText :获得响应的文本数据. * responseXML :获得响应的XML的数据. 方法: * open(请求方式,请求路径,是否异步) :异步去向服务器发送请求. * send(请求参数) :发送请求. * setRequestHeader(头信息,头的值) :处理POST请求方式的中文问题. 创建XMLHttpRequest对象: * IE :将XMLHttpRequest对象封装在一个ActiveXObject组件. * Firefox :直接就可以创建XMLHttpRequest对象. [JavaScript] 纯文本查看 复制代码 function createXmlHttp(){
var xmlHttp;
try{ // Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e){
try{// Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e){}
}
}
return xmlHttp;
}
AJAX的入门 AJAX的编写的步骤: * 第一步：创建一个异步对象. * 第二步：设置对象状态改变触发一个函数. * 第三步：设置向后台提交的路径 * 第四步：发送请求. GET方式提交请求: [JavaScript] 纯文本查看 复制代码 function ajax_get() {
// 1.创建异步对象
var xhr = createXMLHttp();
// 2.设置状态改变的监听 回调函数.
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){ // 请求发送成功
if(xhr.status == 200){ // 响应也成功
// 获得响应的数据:
var data = xhr.responseText;
// 将数据写入到DIV中:
document.getElementById("d1").innerHTML = data;
}
}
}
// 3.设置请求路径
xhr.open("GET","/day15/ServletDemo1?name=aaa&pass=123",true);
// 4.发送请求
xhr.send(null);
}POST方式提交请求: [JavaScript] 纯文本查看 复制代码 function ajax_post(){
// 创建异步对象:
var xhr = createXMLHttp();
// 设置监听:
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
document.getElementById("d1").innerHTML = xhr.responseText;
}
}
}
// 打开路径:
xhr.open("POST","/day15/ServletDemo1",true);
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
// 发送请求:
xhr.send("name=张三&pass=123");
}
JQuery的AJAX JQuery的AJAX部分方法: * Jq的对象.load(路径,参数,回调函数); * $.get(路径,参数,回调函数,数据类型); * $.post(路径,参数,回调函数,数据类型); * $.ajax(); * serialize(); -- JQ的AJAX传递参数的时候需要使用的方法. AJAX的响应的数据: 文本,一段HTML的数据,XML,JSON 使用工具生成XML的文件 通常使用xStream工具. 将集合,数组,对象转成XML.
JSON的概述 JSON的概念: JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于 ECMAScript (w3c制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。 JSON的数据格式的介绍: [XML] 纯文本查看 复制代码 {“id”:1,”name”:aaa}
[{“id”:1,”name”:aaa},{“id”:2,”name”:bbb}]
{
“city”:{“cid”:1,”cname”:”xxx”}
}JSON的生成工具 JSONLIB 转换JSON数据: * JSONArray :将数组或List集合转成JSON. * JSONObject :将对象或Map集合转成JSON. 点进这个帖子的同学肯定是要奋发图强，学技术拿高薪的有志青年，这里我看你骨骼惊奇，是个绝世的练武奇才，你我有缘，今天我就把这个武林秘籍如来神掌传授于你！ 什么？不想学如来神掌？不要紧！这里有各个门派的武林绝学，链接拿好！！哈哈哈哈 | 
收藏
淘帖
踩
