1.认识jq中ajax的封装
jq 对于ajax的封装有两层实现;$.ajax 为底层封装实现;基于 $.ajax
,分别实现了$.get
与$.post
的高层封装实现;
2.ajax的底层实现基本语法:
get请求
<body> <input type="button" value="点击" id="btu"> </body> <script> $('#btu').click(function(){ //get请求 $.ajax({ url:'/jq_ajax_get', success:function(data){ alert(data); } }); }); </script>
post请求:
<body> <input type="button" value="点击" id="btu"> </body> <script> $('#btu').click(function () { $.ajax({ url: '/jq_ajax_post', type: 'post', data: 'id=1111', success: function (data) { alert(data); }, // async:false, }); // alert(22); //检验同步异步 }); </script>
3.ajax的高层实现:
get应用:
url:待载入页面的url地址
data:待发送 key/value 参数。
callback:载入成功时回调函数。
type:返回内容格式,xml, html, script, json, text, _default。
案例:
<body> <input type="button" value="点击" id="btu"> </body> <script> $('#btu').click(function(){ $.get('/jq_ajax_get',function(data){ alert(data); },'json'); }); </script>
post应用:
<body> <input type="button" value="点击" id="btu"> </body> <script> $('#btu').click(function () { $.post('/jq_ajax_post', { id: '11' }, function (data) { alert(data); }); }); </script>
如对本文有疑问, 点击进行留言回复!!
offset、client、scroll (width,height、left,top、X,Y)
网友评论