ajax就是我们可以在页面不刷新的情况下可以完成对数据的操作(增删改查);在一个页面完成
并不是所有的都可以用到ajax
ajax :百度 优酷 需要页面不跳转的时候用到ajax
- ajax 信息存在数据库,关系数据库,非关系数据库 按照需要加载东西 页面不用刷新 不影响其他操作
- html:超文本的标记语言,用来显示信息。 html的根元素就是html
- xml:可扩展的标记语言,用来存储信息。
- 开启一个新的线程 不需要开启一个新进程 只需要在本页面中点开用到ajax
- js单线程异步机制的语言:是一种非常,解决很多语言解决不了的问题。
- 单线程: 同一时间只能处理一件事情,效率低
- 单线异步:一个还是做一件事 ,其他人各做各的
- 异步:所有不能够及时完成的动作都是异步
- 时间控制 setTimeout setInterval 有时间控制的,时间完成后运行
- 事件控制的 window.onload onclick 剩下的都是正常运行的 先正常在时间 事件
- 腾讯要搬到南极 是为了降温。 一、ajax应用场景
- 1、表单异步验证
- 用来异步验证用户名是否存在等!
- 2、深层次导航
- 3.快速的用户与用户间的交流响应。
- 4.类似投票系统
- 5.普通的文本输入提示和自动完成的场景 一、创建ajax对象
- 1.new XMLHttpRequest() // 获取xmlHttprequest对象 ie8以下是没有这个对象的 核心对象;
- 2.new ActiveXObject(“Microsoft.XMLHTTP”)//IE8以下
- 3.做兼容:
- 1.var xmlobj=window.XMLHttpRequest?newnew XMLHttpRequest():.new ActiveXObject(“Microsoft.XMLHTTP”) 二、ajax属性:
- 1.xmlobj.readyState (请求成功==4) 能够找到指定的地址
- 2.xmlobj.status(交易成功==200) 服务器确实给我们返回 了我们要的东西
- 3.xml.response(回复)数据存放在这个里面
- // readyState
- // response
- // responseText 返回文本
- // responseType 返回类型 设置在open后面设置 json
- // responseURL 返回地址
- // responseXML 接受对象
、ajax方法:
*" http: post get"
- 第一步:获得对象。第二步(打开):1xmlobj.open,(“1.以什么方式去取”,“2.去哪里取 地址”,3.默认是异步 异步是true,)第三步:事件。
- xmlobj.send() 发送请求 默认是null
- // abort()停止请求 方法 sleep(2) 时间
- 1xmlobj.onreadystatechange=function(){} 准备状态码改变
- XMLHttpRequest 属性、方法
// onabort 停止事件
// onerror
// onload 加载中
// onloadend 结束请求
// onloadstart 开始请求
// onprogress
// onreadystatechange
// ontimeout 同源策略 - 百度页面只能获取百度页面的东西 不能访问腾讯的东西。
- 1.如何通过ajax获取信息
- get post
- 2.如何通过ajax传递信息
- php后台语言(优秀的语言) 前端-》后台-》数据库-》后台-》前端
- 3.php:wamp w:window a:apache m:mysql(数据库) p:php
- 安装apache 模拟一个服务器的环境 localhost(域名) 127.0.0.1(ip地址) 将域名和地址关联起来(域名解析) 默认会把指定文件夹作为服务器 想执行 必行把文件夹放在www文件下
- http://(协议)baidu.com(域名):80(端口)/aa(路径)/#(代表在本页面中跳转)?/name=zhangsan&age=12&sex=man 一般默认的端口是80。
- file:// 本地之间文件之间的协议
- http://互联网协议--最重要的协议
- https://http基础上加了一些优化 和加密
- ftp://
- svn://
- 4.lamp
php
- 1.语法<?php?>
- 定界符 $aa="我是变量" (数组 、字符串、数值、boolean) 输出 echo $aa;
- $aa=array(
0=>"a",//可以是索引数组
name=>"a"
) - function aa(){
each "函数"
}
aa()$str="名字";
$str1="黄月霞"
echo $str.$str1 ///点代表连接 - class person{}
- 关联数组:下标是字母
- 索引数组:下标只能是数字
- 分号;在js里面分号和回车是耦合的(一样的),代表一行命令的结束;在js中字符串中间不要换行 养成加分号的习惯
- 分号;在php中的分号和回车不是一回事 ,他是解耦的,只有分号代表一行命令的结束,每一行必须要加分号
- php点 .代表连接 运行规则、顺序
- 后缀名是php:apache 解析浏览器能是别的代码,再给了浏览器 后缀名html :先请求 找到相应的地址 看是html就直接丢给浏览器解析 php能写html代码 html不能写php代码
- 通过get返回 $_GET["name"]
- 所有有链接的地方发起http请求 通过ajax发起请求是不希望页面跳转
- 可以获取任何页面的信息 和他交互的是动态语言
- post:头信息:xmlobj.setRequestHeaderr("Content-Type","application/X-www-form-urlencoded") //要放在open后面
/ get方式 // var xmlobj=new XMLHttpRequest(); // var btn=document.getElementsByTagName("input")[0]; // var div=document.getElementsByTagName("div")[0]; // btn.onclick=function(){ // xmlobj.onreadystatechange=function(){ // if(xmlobj.readyState==4){ // if(xmlobj.status==200){ // div.innerHTML=xmlobj.response; // } // } // } // xmlobj.open("get","ajax.php?name=zhangsan&pass=123456"); // xmlobj.send(); // }
// post方式
var xmlobj=new XMLHttpRequest();
var btn=document.getElementsByTagName("input")[0];
var div=document.getElementsByTagName("div")[0];
btn.onclick=function(){
xmlobj.onreadystatechange=function(){
if(xmlobj.readyState==4){
if(xmlobj.status==200){
div.innerHTML=xmlobj.response;
}
}
}
xmlobj.open("post","ajax.php");
xmlobj.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlobj.send("name=zhangsan&pass=123456");
}
php
<?php
// echo "我是黄月霞";
// if($_POST["name"]=="zhangsan"&&$_POST["pass"]==123456){
// echo "ok";
// }else{
// echo "no";
// }
echo $_POST["name"];
echo $_POST["pass"];
?>
###XML
* xml:1.html是有xml扩展而来的;2.xml是一种扩平台的、扩语言标签语言,3.xml主要通过标签来存储数据
* xml语法规则:1.只能有一个根元素 ,2.没有定义的标签,可以自己定义标签 3.必须要以字母开头
* 1.返回的数据是 xmldocumentobj
* 2.返回的类型 text
* 3. responseType 返回类型 设置在open后面设置 值:json text (默认是纯文本) document arraybuffer bold (二进制) 存储数据在response身上
* 4.xml格式 存储数据保存在responseXML.