数据算法 Vue全家桶 莱斯分布 oracle dictionary swagger Backbonejs vue网页 bootstrap后台模板 nodejs视频教程 jquery遍历对象 jq获取元素 jquery获取元素 oracle删除字段 c语言求和 mac脚本编辑器 matlab停止运行 css面试题 java手机验证码 matlab自然对数 python语言 python连接mysql数据库 python指令 java的接口 java环境包 java如何使用 java写入txt java操作数据库 忧思华光玉 冬青鼠 iphone滚动截屏 网络克隆 卡巴斯基离线升级包 中维高清监控系统安装 ansys安装教程 红巨人插件 苹果手机添加邮箱 idea下载 ps画笔工具变成十字 edius调色
当前位置: 首页 > 学习教程  > 编程语言

js封装jsonp

2021/1/13 19:41:55 文章标签: 测试文章如有侵权请发送至邮箱809451989@qq.com投诉后文章立即删除

保存对代码的热爱,并保存怀疑态度 jsonp的原理:利用script标签不会触发浏览器的同源策略,及script标签将自身引用的数据,作为js代码执行的原理。配合函数的传参(执行时的参数发送给定义时的参数),实现跨域数据的获取。…

保存对代码的热爱,并保存怀疑态度
jsonp的原理:利用script标签不会触发浏览器的同源策略,及script标签将自身引用的数据,作为js代码执行的原理。配合函数的传参(执行时的参数发送给定义时的参数),实现跨域数据的获取。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" name="" id="tet1">
    <input type="text" name="" id="tet2">
    <input type="button" name="" id="btn">
</body>
<script>
    var tet1=document.getElementById("tet1");
    var tet2=document.getElementById("tet2");
    var btn=document.getElementById("btn");

    btn.onclick=function(){
        josnp("json.php",function(ok){   //路径名
            console.log(ok);
        },{
            df:tet1.value,   //后端的参数
            xc:tet2.value,
            qwe:"work",// 后端要执行的函数的名字
            cn:"qwe"   // 后端接收的函数的名字所在的字段名
        })
    }

    function josnp(url,cd,data){
        var str=""
        for(var i in data){
            str+=`${i}=${data[i]}&`;
            url=url+"?"+str+"__sd__="+Date.now();
        }


        var script=document.createElement("script");
            script.src=url;
            document.body.appendChild(script);
        
        window[data[data.cn]]=function(res){
            cd(res)
        }
    }
</script>
</html>

本文链接: http://www.dtmao.cc/news_show_600164.shtml

附件下载

相关教程

    暂无相关的数据...

共有条评论 网友评论

验证码: 看不清楚?