Ajax技术[6]-jQuery提供的Ajax快捷方法(2)

来源：互联网发布：macair如何删除软件编辑：程序博客网时间：2024/06/16 15:26

ajax01.html

客户端

<!DOCTYPE html><!--客户端--><!--课时46初探浏览器原生Ajax接口(1)--><!--使用get方式拿到服务器数据--><html id="html"><head>    <meta charset="utf-8" />    <title>demo</title>    <script type="text/javascript" src="jquery-2.1.4.min.js"></script>    <script type="text/javascript">        $(function(){            $('button').click(function(){                 //从服务器载入数据并且将返回的 HTML 代码替换 匹配的元素 的后代元素                 //.ul0服务器返回，内容的某个class，不指定class则表示返回的所有内容//                 $('#div1').load('get.php .ul0',function(responseText,textStatus,jqXHR){////                 });                 //使用一个HTTP GET请求从服务器加载并拿到当前页来执行一个 JavaScript 代码//                 $.getScript('get.php',function(script,textStatus,jqXHR){//                 console.log(jqXHR);//                 });//                 $.getJSON('get.php',{id:1},function(data,textStatus,jqXHR){//                 console.log(data);//                 });                 //跨源请求，只需要在 请求的url地址后面接上一个查询字符串callback=?//                 $.getJSON('http://127.0.0.1/MyTestAjax07/get.php?callback=?',{id:1},function(data){//                 console.log(data);//                 });//                 var jqXHR=$.get('get.php');//                 jqXHR.done(function(data,textStatus,jqXHR){//                 //请求成功之后执行的回调函数//                 alert('请求成功了！');//                 console.log(data);//                 });//                 jqXHR.fail(function(jqXHR,textStatus,errorThrown){//                 //请求失败之后执行的回调函数//                 alert('请求失败了！');//                 console.log(errorThrown);//                 });//                 jqXHR.always(function(a,b,c){//                 //该回调函数的参数如果 请求是成功的则同done方法的参数,如果请求是失败的则同fail方法的参数//                 //请求完成之后执行的回调函数//                 alert('请求完成了！');//                 console.log(a);//                 });//                把上面的代码连起来写                 $.get('get.php',function(){                 console.log(':))');                 }).done(function(data){                 console.log(data);                 }).fail(function(){                 console.log(':((');                 }).always(function(){                 console.log('always');                 });            });        });    </script></head><body><button>开始</button><div id="div1">    div1</div></body></html>

get.php

服务器端

<?php//sleep(3);//$html=<<<A//<ul class="ul0">//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//</ul>//<ul class="ul1">//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//    <li>哈哈！</li>//</ul>//A;//echo $html;//$script=<<<A//alert(':))');//A;//echo $script;$json=<<<A[{"title":"标题","url":"http://sifangku.com"},{"title":"标题2","url":"http://baidu.com"}]A;//返回json数据echo $json;//返回JSONP数据//echo "{$_GET['callback']}({$json})";?>

0 0