ajax 是什么？有什么作用？
含义：AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML 通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
作用：实现网页的异步加载，局部刷新网页。当在向服务器获取新数据时不需要刷新整个网页，提高用户体验。
前后端开发联调需要注意哪些事情？后端接口完成前如何 mock 数据？
注意事项：1.约定接口：确定接口名称及请求和响应的格式，请求的参数名称、响应的数据格式；
2.约定数据：有哪些需要传输的数据，数据类型是什么；
3.根据这些数据整理成接口文档
如何 mock 数据：可以自己制作一些假数据来验证我们的接口和响应是否正确
点击按钮，使用 ajax 获取数据，如何在数据到来之前防止重复点击?
var lock = true； var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if( !lock ){ return; } if(xhr.readystate === 4){ if(xhr.readystatus===200){ xxx } } lock = true; } xhr.open(); xhr.send(); lock = false ;
ajax
function ajax(opts){ var xhr = new XMLHttpRequest(); var lock = false; var dataString = ""; if(!lock){ xhr.onreadystatechange = function(){ if(xhr.readyState===4){ if((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304){ var results = JSON.parse(xhr.responseText); opts.success(results); lock = false; } }else{ opts.error(); } }; for(var key in opts.data){ dataString += key+"="+opts.data[key]+"&"; } dataString = opts.url + dataString; xhr.open(opts.type,opts.url/"username=ruoyu",true); xhr.send(); lock = true; } } document.querySelector('#btn').addEventListener('click', function(){ ajax({ url: '/login', //接口地址 type: 'get', // 类型， post 或者 get, data: { username: 'ruoyu', password: 'abcd1234' }, success: function(ret){ console.log(ret); // {status: 0} }, error: function(){ console.log('出错了'); } }); });
