JSONP基础知识详解

前端之家收集整理的这篇文章主要介绍了JSONP基础知识详解前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

前面的话

JSONP是JSON with padding(填充式JSON或参数式JSON)的简写,是应用JSON的一种新方法,常用于务器与客户端跨源通信,在后来的Web服务中非常流行。本文将详细介绍JSONP

基础

JSONP的基本思想是,网页通过添加一个

【后端】

PHP;">

百度搜索

百度搜索框就是使用了JSONP的技术,在百度搜索的URL中,有用的查询如下

https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=123&&cb=a

结果为:

查询网","123网址之家","12366"]});

所以,wd为关键词,cb用来JSONP的函数名。在获取的数据中,s为以关键词开始的数据组成的数据

百度搜索的关键URL如下

https://www.baidu.com/s?wd=a

wd为关键词,当wd=a时,将打开关键词为a的网页

body{margin: 0;} ul{margin: 0;padding: 0;list-style: none;} a{color:inherit;text-decoration: none;} input{padding: 0;border: 0;} .Box{width: 340px;height: 38px;border: 2px solid gray;} .con{overflow: hidden;} .input{float: left;width: 300px;height: 38px;} .search{width: 38px;height: 38px;float: right;background: url('http://sandBox.runjs.cn/uploads/rs/26/ddzmgynp/search.png') 0 -38px;} .list{position: absolute;width: 298px;border: 1px solid #e6e8e9; overflow: hidden;} .in{line-height: 30px;border-bottom: 1px solid lightblue;cursor:pointer;text-indent: 1em;} .list .in:last-child{margin-bottom: -1px;} .in:hover{background-color: #f9f9f9;}
Box" id="Box">

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程之家!

原文链接:https://www.f2er.com/js/40615.html

猜你在找的JavaScript相关文章