有时候用js封装个小工具需要一些已经被封装好的函数,比如jq的jsonp

但是原生小工具如果仅仅为了这个就导入一个上百kb的jQuery不划算

然后我去网上找,一大堆废文,还是自己发一篇记录一下吧

下面是 jsonp 在 js 中的实现方法

/**
* 模拟实现jsonp
* @param {Object} url
* @param {Object} callback
*/
function jsonp(url, callback) {
var callbackName = 'jsonp_callback_' + (new Date().getTime());
window[callbackName] = function(data) {
delete window[callbackName];
document.body.removeChild(script);
callback(data);
}; var script = document.createElement('script');
script.src = url + (url.indexOf('?') >= 0 ? '&' : '?') + 'callback=' + callbackName;
document.body.appendChild(script);
}

原生js实现jsonp的更多相关文章

  1. 基于原生JS的jsonp方法的实现

    基于原生JS的jsonp方法的实现 jsonp,相信大家并不陌生,是在js异步请求中解决跨域的方法之一,原理很简单,有不清楚的同学可以google下,这里就补详细解释了.在Jquery库中,jQuer ...

  2. 用原生js来处理跨域的数据(jsonp)

    说明总结: 1.ajax和jsonp其实本质上是不同的东西.ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提 ...

  3. 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)

    1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...

  4. 原生js实现简单JSONP

    JSONP是一种非常常见的实现跨域请求的方法.其基本思想是利用浏览器中可以跨域请求外链的JS文件,利用这一特性实现数据传输. 用原生JS实现JSONP非常简单,无非几点: 1)定义一个函数,用于处理接 ...

  5. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  6. Ajax进阶之原生js与跨域jsonp

    什么是Ajax? 两个数求和: 用Jquery和数据用json格式 viws函数: from django.shortcuts import render,HttpResponse # Create ...

  7. 用原生js实现ajax、jsonp

    转载: http://www.cnblogs.com/yangheng/p/6065910.html 一.原生js实现ajax $.ajax({ url: '', type: 'post', data ...

  8. 原生JS和jQuery分别使用jsonp来获取“当前天气信息”

    需掌握的技能点: jsonp.跨域相关等. 以下两种代码,均可直接运行. 1.使用原生JS: <!DOCTYPE html> <html lang="en"> ...

  9. 用原生JS实现AJAX和JSONP

    前端开发在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的.其实,原生 ...

  10. AJAX请求和跨域请求详解(原生JS、Jquery)

    一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...

随机推荐

  1. for循环及range内置方法

    目录 while循环补充说明 流程控制之for循环 range方法 rang实战案例 作业 """ 1.先写注释(思维逻辑和想法) 2.先考虑主体功能 在考虑附加功能 & ...

  2. 方法的重载(overload)

    1.定义:在同一个类中,允许存在一个以上的同名方法,只要它们的参数个数或者参数类型不同即可. "两同一不同":同一个类.相同方法名 参数列表不同:参数个数不同,参数类型不同 2.举 ...

  3. laravel 报错 AUTH` failed: ERR Client sent AUTH, but no password is set

    明明没有设置redis密码.访问时候却报错 在代码里面的databases.php 改成这样就可以了.predis新版也会有取不到passwor的时候.改成我截图那样也可以.他默认取的是default ...

  4. JSP+servlet+mybatis+layui服装库存管理系统(大三上学期课程设计)

    阿西吧.自从学会使用框架.再看以前写的.我真的是要死了.项目用的还不是maven.整理项目能给我搞死.更要命的是这个项目还是用eclipse写的.数据库还是SQL server.阿西吧 这个系统代码不 ...

  5. 齐博x2向上滚动特效

    要实现图中圈起来的向上滚动特效,大家可以参考下面的代码 <!--滚动开始--> <style type="text/css"> .auto-roll{ he ...

  6. HTML元素大全(2)-表单

    01.<form>表单 <form> 表单是比较重要的HTML元素,块元素,主要作用是向服务端提交数据.结合表单元素input使用,通过内部的button按钮提交(type=& ...

  7. 基于docker安装jumpserver

    以下配置均在一台ubuntu上实现 # 生成宿主机Mysql配置文件,便于docker内容器使用 [root@ubuntu2004 ~]#mkdir -p /etc/mysql/mysql.conf. ...

  8. mybatis-核心配置文件讲解

    核心配置文件详解 核心配置文件中的标签必须按照固定的顺序(有的标签可以不写,但顺序一定不能乱): properties.settings.typeAliases.typeHandlers.object ...

  9. Json web token(JWT)攻防

    免责声明: 本文章仅供学习和研究使用,严禁使用该文章内容对互联网其他应用进行非法操作,若将其用于非法目的,所造成的后果由您自行承担,产生的一切风险与本文作者无关,如继续阅读该文章即表明您默认遵守该内容 ...

  10. 随笔——写windows服务的时候如何调试 c# .net

    流程 1.更改项目 应用程序--输出类型--windows应用程序 改为 控制台应用程序 2.Program启动类中添加调用代码 3.服务类里面添加启动方法去启动OnStart和 Console.Re ...