原生 jsonp

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jsonp</title>
</head>
<body>
<!-- <div>
同源策略(基于安全性的考虑,只能访问相同域名下的数据)
跨域(访问其他域名下的数据)
</div>
<div id="">
jsonp
</div> -->
<input type="text" id="keyword" />
<div id="result"></div>
<script>
var keyword = document.getElementById("keyword");
var result = document.getElementById("result");
function aaa(d) {
console.log(d.s);
var html = "";
for(var i = 0; i < d.s.length; i++) {
html += d.s[i] + "<br/>";
}
result.innerHTML = html;
// result.innerHTML = d.s;
}

keyword.oninput = function() {
var script = document.createElement("script");
script.src = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd="+keyword.value+"&cb=aaa"
document.head.appendChild(script);
document.head.removeChild(script);
}
</script>
</body>
</html>

时间: 2024-08-09 02:00:46

原生 jsonp的相关文章

原生jsonp跨域

<script> // jsonp跨域原生写法 var script = document.createElement('script'); script.src = 'http://192.168.7.16/kuayu/test02.php?callback=aa'; document.body.appendChild(script); //aa('后台数据') function aa(res) { alert(res.website); } </script>

网上收集修改的原生jsonp代码

;(function(){     var formatParams = function(data) {//格式化参数         var arr = [];         for (var name in data) {             arr.push(encodeURIComponent(name) + '=' + encodeURIComponent(data[name]));         }         return arr.join('&');     }  

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

一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. 本博客实验环境: python:2.7.11 web框架:tonado jquery:2.1.1 二.“伪”AJAX 由于

手写个jsonp

原生jsonp具体实现 先上代码: //http://www.baidu.com?aa=11&callback=my_jsonp04349289664328899 var jsonp = function(url,param,callback){ //处理url地址,查找?,如果没有?这个变量就有一个"?",有?这个变量接收一个& var querystring = url.indexOf("?") == -1?"?":"

原生JS封装Ajax插件(同域&amp;&amp;jsonp跨域)

抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正确的地方,还望指正^_^ 一.Ajax核心,创建XHR对象 Ajax技术的核心是XMLHttpRequest对象(简称XHR),IE5是第一款引入XHR对象的浏览器,而IE5中的XHR对象是通过MSXML库中的一个ActiveX对象实现的,因此在IE中可能有3个版本,即MSXML2.XMLHttp.

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

1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现,现在所有支持JavaScript 的浏览器都会使用这个策略. 所谓同源,就是指两个页面具有相同的协议,主机(也常说域名),端口,三个要素缺一不可. 所谓同源策略,指的是浏览器对不同源的脚本或者文本的访问

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

基于原生JS的jsonp方法的实现 jsonp,相信大家并不陌生,是在js异步请求中解决跨域的方法之一,原理很简单,有不清楚的同学可以google下,这里就补详细解释了.在Jquery库中,jQuery直接封装有jsonp的方法,很简便,只需在ajax请求的参数中加入datatype:jsonp,jsonp:jsonpcallback即可,这里写下用原生js实现jsonp的源码. load= function (url, cfg, success) { var op = Object.proto

原生JS实现AJAX、JSONP及DOM加载完成事件

一.JS原生Ajax ajax:一种请求数据的方式,不需要刷新整个页面:ajax的技术核心是 XMLHttpRequest 对象:ajax 请求过程:创建 XMLHttpRequest 对象.连接服务器.发送请求.接收响应数据: 下面简单封装一个函数,之后稍作解释 ajax({ url: "./TestXHR.aspx", //请求地址 type: "POST", //请求方式 data: { name: "super", age: 20 },

原生 JavaScript 实现 AJAX、JSONP

相信大多数前端开发者在需要与后端进行数据交互时,为了方便快捷,都会选择JQuery中封装的AJAX方法,但是有些时候,我们只需要JQuery的AJAX请求方法,而其他的功能用到的很少,这显然是没必要的. 其实,原生JavaScript实现AJAX并不难,这篇文章将会讲解如何实现简单的AJAX,还有跨域请求JSONP! 一.AJAX AJAX的核心是XMLHttpRequest. 一个完整的AJAX请求一般包括以下步骤: 实例化XMLHttpRequest对象 连接服务器 发送请求 接收响应数据