华山资源网

jsonp跨域及实现百度首页联想功能的方法
网络编程 2024/11/17 佚名
3 1

什么是跨域呢？

比如说ajax必须在自己的域(名)之下，才能进行异步的请求，如果不是在同一个域之下就不能进行请求，会报错。比如说我们用ajax去请求腾讯的API如果我们的这个域不在腾讯那个接口的'白名单'里面，腾讯的接口就会拒绝给我返回数据。但是大多数情况下，我们不可能每次都去去相应的网站申请一个'白名单'，这个时候我们就要用到跨域这种方法，跨域有很多方式比如说用iframe但是这种的可操作性太差了，不能操作frame里面的DOM元素。当先最流行的一种的方式是使用jsonp这种方式。

什么是JSONP

jsonp是英文为json with padding的简称。简单地来说jsonp就是script标签,通常的我们把script，link，img叫做资源标签，也就是能连接资源的意思。只要记住了jsonp就是script标签就好了。下面我们来说下一部分：

script标签怎么引入数据

我们如果知道操作系统并不是靠后缀名来识别一个文件的，是靠文件里面的内容来识别的，后缀名知识更利于第三方的软件进行查看。比如说我们把a.txt改为a.png那么我门用图片查看器打开的时候也是显示的图片不存在的(如果学过Linux的同学会更好的理解)。【有兴趣的同学可以尝试这把一个js文件的后缀改为其他格式再引入试试】。那么我们就解决的script如何引入数据的问题了，也就是说我们可以用script标签引用一个json或者.php的资源文件.

就算能引入资源，那么资源怎么使用呢

先举个简单地例子，比如我们在一个a.json定义了下面的一个变量

"text";

我们在HTML中去加载它，然后去执行，如下代码：

<script src="/UploadFiles/2021-04-02/a.json">


这样是能正确执行了，但是我们也知道json数据中并没有定义什么变量和方法的，这个就好像下面的方式：





var str="text";





我们在HTML中去加载它，然后去执行，如下代码：





<script src="/UploadFiles/2021-04-02/a.json">


这样显然是会报错的，那么跨域解决之后就要解决怎么使用这个资源的问题了。 




我们先和后台定义一个方式，把所有的数据作为一个函数的参数去调用函数，当然这个函数是我们预先定义好的了，如下面的格式：





function solve(data){
//使用数据
}
<script src="/UploadFiles/2021-04-02/a.json">


下面我们来看看a.json是怎么定义的





solve(100);
solve({});
//相当于a.json里面的数据作为参数传递到了solve函数里面，然后，在solve函数里面操作这个数据就可以了





资源里面要有几个方法




先看下面的例子，当我们引入一个PHP动态资源的时候





<"111";
$b = "aaa";
if ($t == 'num') {
$data = json_encode($a);
} else {
$data = json_encode($b);
}
echo solve($data)






比如我们有两个按钮一个按钮执行的时候要求，收到$a另一个要求收到$b，那我们应该怎么搞？在pho文件中加一个solve()"htmlcode">



<"color: #ff0000">jsonp跨域实现百度首页联想功能


主要思路是利用jsonp的跨域，使用百度后台接口，根据input框的内容，向后台拿数据，然后展示在搜索框下面，并且li使用的是a标签包裹，基本实现了和百度首页收缩然后跳转的功能


结果截图





  <script>
   var timer = null // 防抖动
   var domInput = document.getElementById('input')
   var domul = document.getElementsByTagName('ul')[0]
   domInput.oninput = function (e) {
    clearTimeout(timer) //防抖动
    timer = setTimeout(function () {
     var domScript = document.createElement('script')
     domScript.src = 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su"text-align: center">jsonp跨域及实现百度首页联想功能的方法


可实现点击联想词跳转


jsonp跨域及实现百度首页联想功能的方法


以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。


                                

                                

                                     

                                
华山资源网 Design By www.eoogi.com

                            

                        

                        

                            

                                广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）

                                免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
                            

                        

                        

                            
                            
                        

                        
                        
华山资源网 Design By www.eoogi.com
www.eoogi.com 华山资源网
120,135影音资源
344,641技术资源
22,817软件资源
435,032站长资源

《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒 经典版》的玩家都可以获得奖励。

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
华山资源网 Design By www.eoogi.com