<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> </head> <body> <button id='but'>ajax-get</button> <li class='lis'></li> </body> <script type="text/javascript"> //原生方式ajax提交四步操作 //1.new XMLHttpRequest //2.open('get/post','文件名','true/flase'); //3.send()发送请求 //4.ajax.onreadystatechange = function(){ // if(ajax.readyState ==4 && ajax.status ==200){ //从服务器返回的结果 // console.log(ajax.responseText); // 以上接受数据 //} // } var Ajax = new XMLHttpRequest(); Ajax.onreadystatechange = function(){ if(x.readyState ==4 && x.status ==200){ //服务器返回的结果 console.log(x.responseText); } } Ajax.open('GET','demo.php',true); Ajax.send(); //创建一个点击事件 $('#but').click(function(){ //发送ajax //$.get('文件路径','{传值}',function(data) 回调函数 // //),'json') 规定返回结果为json数据 $.get('04_gets.php',{id:10},function(data){ //直接打印打印不出来 // console.log(data); //eval() 用于将json数据转换为js字符串 // eval('var obj = '+data); // $('.lis').text(obj.uname); // console.log(obj.uname); //.text(data.unname[这里是要]) //第二种 json //text() 方法设置或返回被选元素的文本内容。 // $('.lis').text(data.unname); // console.log(data); for(var i=0;i<data.length;i++){ document.write(data[i].uname+'<br>'); } },'json') }) </script> </html>
点击 "运行实例" 按钮查看在线实例