W:Ajax

Q:异步网络请求。无刷新请求数据。

W:ajax的实现流程如下:

Q:

  1. 创建XHR对象
  2. 调用open()方法,创建请求
  3. 调用send()方法,发送请求
  4. 捕获请求状态,判断请求结果
  5. 获取数据库返回的数据

W:xml参数

Q: XHR对象相关属性:
  • readyState:请求 /相应过程的当前活动阶段
  • responseText:作为响应主体被返回的文本
  • responseXML:如果相应的内容类型是text/xml或者application这个属性中将保存着响应数据的XMLDOM文档
  • status:相应的HTTP状态
  • statusText:HTTP状态说明

W:举个例子

//js部分

1.声明获取变量

var username = document.getElementById("username");

var passwd = document.getElementById("passwd");

var loginBtn = document.getElementById("loginBtn") loginBtn.onclick = function ()

{ //设置请求地址

var url = "login.php";

//提交内容

var postbody = "username="+username.value+"&passwd="+passwd.value;

//发起ajax请求,并使用回调函数实现功能

request("POST",url,postbody,function (resText)

{ //把json格式的字符串转换成对象

var obj = JSON.parse(resText); alert(obj.msg); });

}

W:ajax 使用

Q:使用$.ajax()方法

1.url:发送请求的地址

2.type:请求方式默认get(post/get)

3.async :默认true   为异步

4.data: 要求为object或 string 类型的参数

5.complete: 求完成后调用的回调函数(请求成功或失败时均调用)

6.success :  请求成功后调用的回调函数,有两个参数。
                 (1)由服务器返回,并根据dataType参数进行处理后的数据。
                 (2)描述状态的字符串。
                 function(data, textStatus){
                   //data可能是xmlDoc、jsonObj、html、text等等
                   this;  //调用本次ajax请求时传递的options参数
                }

ajax 个人理解 学习笔记的更多相关文章

  1. CSS深入理解学习笔记之absolute

    1.absolute和float 拥有相同的特性表现: ①包裹性(容器应用之后,可以包裹里面的内容): <!doctype html> <html> <head> ...

  2. CSS深入理解学习笔记之vertical-align

    1.vertical-align基本认识 支持的属性值: ①线类:baseline(默认),top,middle,bottom ②文本类:text-top,text-bottom ③上标下标类:sub ...

  3. CSS深入理解学习笔记之margin

    1.margin与容器尺寸 元素尺寸:①可视尺寸 clientWidth(标准):②占据尺寸 margin与可视尺寸:①适用于没有设定width/height的普通block元素:②只适用于水平方向尺 ...

  4. CSS深入理解学习笔记之float

    1.float的历史 float设计的初衷仅仅是为了文字环绕效果. 示例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transit ...

  5. CSS深入理解学习笔记之overflow

    1.Overflow基本属性 overflow:visible(默认)/hidden/scroll/auto/inherit; visible:超出部分可见. hidden:超出部分隐藏. scrol ...

  6. CSS深入理解学习笔记之line-height

    1.line-height的定义 定义:两行文字基线之间的距离. 注:不同字体之间的基线是不同的. 2.line-height与行内框盒子模型 行内框盒子模型: ①内容区域(content area) ...

  7. CSS深入理解学习笔记之relative

    1.relative和absolute的相煎关系 限制作用:①限制left/top/right/bottom定位:②限制z-index层级:③限制在overflow下的嚣张气焰. relative和f ...

  8. CSS深入理解学习笔记之z-index

    1.z-index基础 z-index含义:指定了元素及其子元素的"z顺序",而"z顺序"可以决定元素的覆盖顺序.z-index值越大越在上面. z-index ...

  9. CSS深入理解学习笔记之padding

    1.padding与容器尺寸之间的关系 对于block水平元素:①padding值暴走,一定会影响尺寸:②width非auto,padding影响尺寸:③width为auto或box-sizing为b ...

随机推荐

  1. 陈正冲老师讲c语言之内存的申请malloc() 和释放free()

    1.如何使用 malloc 函数 不要莫名其妙,其实上面这段小小的对话,就是malloc的使用过程.malloc是一个函数,专门用来从堆上分配内存.使用malloc函数需要几个要求: 内存分配给谁?分 ...

  2. Css中路径data:image/png;base64的用法详解 (转载)

    大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: background-image:url(data:image/png;base64, iVBORw0KGg ...

  3. CSS Variables

    CSS原生变量(CSS自定义属性) 示例地址:https://github.com/ccyinghua/Css-Variables 一.css原生变量的基础用法 变量声明使用两根连词线"-- ...

  4. react系列(二)高阶组件-HOC

    高阶组件 简单来说,高阶组件可以看做一个函数,且该函数接受一个组件作为参数,并返回一个新的组件. 我在之前的博客<闭包和类>中提到一个观点,面向对象的好处就在于,易于理解,方便维护和复用. ...

  5. 若是将Map作为Key,存入Redis,该如何操作?

    1.先封装HashMap Map<String,Object> map=new HashMap<String,Object>(); map.put("name&quo ...

  6. Matlab 编程入门(一):编程基础

    上学期学了一些matlab的知识,这学期再用时竟然发现已经忘得差不多了(┬_┬) 于是决定重新开始并将它们记录下来,也方便自己以后查漏补缺! M文件编程 脚本文件 matlab有自己的命令行窗口,对于 ...

  7. Linux中文件I/O函数

    一.lseek函数 每个打开文件都有一个与其相关联的“当前文件偏移量”.它通常是一个非负整数,用以度量从文件开始处 计算的字节数.通常,读.写操作都从当前文件偏移量处开始,并使偏移量增加所读写的字节数 ...

  8. diff命令--比较两个文件的命令

    可以使用 --brief 来比较两个文件是否相同,使用 -c参数来比较这两个文件的详细不同之处,这绝对是判断文件是否被篡改的有力神器,

  9. opencv移植(二)

    原文:https://blog.csdn.net/Guet_Kite/article/details/78667175?utm_source=copy 版权声明:本文为博主原创文章,转载请附上博文链接 ...

  10. python闭包的概念及使用

    闭包:在函数里定义了另外一个函数(函数嵌套),内函数里运用了外函数的变量,外函数返回内函数的函数引用(函数名). nonlocal 的使用:闭包内部函数可直接调用外部函数的变量,如果修改需要使用non ...