标签：function 防抖 abc console 跨域 res ajax jsonp 节流

1.同源：就是两个url的协议、域名、端口一致，反之，就是跨域；
2.出现跨域的原因：浏览器的同源策略不允许非同源的url之间进行资源交互。
3.同源策略：是两个url的协议、域名、端口不一致，就会阻止数据的接收；
4.浏览器对跨域请求的拦截：

如何实现跨域请求

1.JSONP:只支持get请求，不支持post，前端
2.CORS：支持get和post，缺点不支持底版浏览器；后端已经解决好的

JSONP实现原理

通过

  function abc(obj) {
      console.log(obj);
      console.log('abc被调用了');
    }
  </script>
  <script src="https://suggest.taobao.com/sug?q=a&callback=abc"></script>

jquery中的JSONP

记得引入jquery.js文件

  $.ajax({
          url: 'https://suggest.taobao.com/sug?q=a&callback=abc',//传参的话，以？形式添加；
          dataType: 'jsonp',//将ajax请求转换成jsonp请求；
          success: function (res) {
            console.log(res);
          }
        })

1.自定义服务端参数名称：
jsonp：‘callback’,

  $.ajax({
          url: 'https://suggest.taobao.com/sug?q=a&callback=abc',//传参的话，以？形式添加；
          dataType: 'jsonp',//将ajax请求转换成jsonp请求；
          jsonp：'callback';
          success: function (res) {
            console.log(res);
          }
        })

2.自定义回调函数名称：
jsonpCallback：’abc’;

  $.ajax({
          url: 'https://suggest.taobao.com/sug?q=a&callback=abc',//传参的话，以？形式添加；
          dataType: 'jsonp',//将ajax请求转换成jsonp请求；
          jsonp：'callback';//自定义回调函数名称
          jsonpCallback：'abc';//自定义服务端参数名称：
          success: function (res) {
            console.log(res);
          }
        })

输入框的防抖

1.防抖策略：是事件被触发后，延迟n秒后在执行回调，如果在这n秒内事件被触发，则重新计时。

var item = null;
        var bun = document.querySelector('button');
        bun.onclick = function () {
            clearTimeout(item)
            item = setTimeout(function () {
                alert(1111)
            }, 200)
        }

节流

先定义一个节流阀
再定义一个定时器

var bun = document.querySelector('button');
        var flag = true;
        bun.onclick = function () {
            if (flag) {
                flag = false;
                setTimeout(function () {
                    flag = true;
                }, 1000)
                console.log(111111);
            }
        }

标签：function,防抖,abc,console,跨域,res,ajax,jsonp,节流
来源： https://blog.csdn.net/weixin_43991433/article/details/112168982

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。