第十节(jQuery - AJAX )
1:jQuery - AJAX 简介 AJAX 是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新 什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示 关于 jQuery 与 AJAX jQuery 提供多个与 AJAX 有关的方法。 通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素 2: 用于通过 HTTP GET 或 POST 请求从服务器请求数据 HTTP 请求:GET vs. POST 两种在客户端和服务器端进行请求-响应的常用方法是:GET 和 POST。 GET - 从指定的资源请求数据 POST - 向指定的资源提交要处理的数据 GET 基本上用于从服务器获得(取回)数据。注释:GET 方法可能返回缓存数据。 POST 也可用于从服务器获取数据。不过,POST 方法不会缓存数据,并且常用于连同请求一起发送数据 例题: js文件夹里的test.js的内容: /* $(function(){ alert("亲爱的徒弟们,你就才是这个行业未来的精英,只有懂得坚持并且有梦想的人才是这个最可爱的人 !"); alert("太帅了 !"); }); */ <body> <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $.ajax({ type:"get", url:"js/test.js", dataType:"script" }); </script> </body> /////////////////////////////////////////////////////////////////////// data文件夹里面的data.html的内容为 /* [ {name:"Ming",sex:"男"}, {name:"小明",sex:"男"}, {name:"keke",sex:"男"} ] */ <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> $.ajax({ type:"get", url:"data/data.html", success:function(data){ // alert(data); //$("p").text(data); var arr = eval(data); for(var i = 0; i < arr.length; i++){ $("p").append("姓名:"+arr[i].name+"------性别:"+arr[i].sex+"<br /><br />"); } } }); </script> </body>