ajax快速入门-创新互联

ajax 快速入门

为双峰等地区用户提供了全套网页设计制作服务,及双峰网站建设行业解决方案。主营业务为成都网站建设、成都网站设计、双峰网站设计,以传统方式定制建设网站,并提供域名空间备案等一条龙服务,秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求,就会得到认可,从而选择与我们长期合作。这样,我们也可以走得更远!

ajax作用:ajax 是在不重新加载整个页面的情况下与服务器交换数据并更新部分网页的技术.(实现浏览器与服务器之间的数据交互,实现页面的无刷新请求服务器,提高用户体验)

基本使用:

1.创建ajax对象:

new XMLHttpRequest() //普通浏览器使用,ie浏览器有特殊

2.创建事件函数(处理服务器返回的结果):

onreadystatechange

readyState  ajax对象状态:0:请求未初始化 1:服务器连接已建立 2:请求已接收 3:请求处理中 4请求已完成,且响应

status 响应码:200:'ok'   404:未找到页面  403:权限不足

responseText  接受服务器的返回的数据

3.初始化ajax请求

get --- xmlhttp.open('GET',1.php?a=1&b=2&c-3',true);

post --- xmlhttp.setRequestHeader('content-type','application/x-www-form-urlencoded"):

xmlhttp.open('POST','1.php',true);

4.发送ajax请求 --- send()

服务器返回

  1. echo 普通的字符串

  2. 普通html文件

  3. 返回xml字符串

  4. 索引数组

  5. 关联数组

注意事项

同源策略-当前页面要和服务器的协议地址和端口都要相同

post发送ajax请求

--- setRequestHeader("content-type','application/x-www-from-urlencoded");

--- 发送参数 send("a=100&b=www")

firebug的使用

例子: //1.创建ajax对象 var x = new XMLHttpRequest; //2.触发事件 x.onreadystatechange = function(){      // on  ready 准备 state状况 changge     if(x.readyState == 4 && x.status == 200){         console.log(x.responseText);   //返回的结果         } } //3.初始化 x.open('GET','fuxi.php?id=100',true);   //true 异步 false是同步 //4 发送 x.send();  //发送ajax 如果是post 方式 3步和4步发生改变 x.open('POST','3.php',true); x.setRequestHeader('content-type','application/x-www-form-urlencoded');重要 x.send('a=100&b=200');

配合php PDO预处理

prepare('select * from phones where id = ?'); //赋值 $arr = [$id]; //执行 $stmt->execute($arr); //获取结果 $res = $stmt->fetch(PDO::FETCH_ASSOC); // var_dump($res); $row = json_encode($res); echo $row;

另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


名称栏目:ajax快速入门-创新互联
本文URL:http://ybzwz.com/article/pgejc.html