<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" id="text">
<ul></ul>
<script type="text/javascript">
var t=document.getElementById("text");

t.onblur=()=>{var v=t.value;
jsonp(v);
}
function fn(data){
var html='';
for (var i=0; i<data.s.length; i++) {
html += '<li><a target="_blank" href="http://www.baidu.com/s?wd='+data.s[i]+'">'+ data.s[i] +'</a></li>';
}
document.getElementsByTagName("ul")[0].innerHTML=html;
}
function jsonp(val){
var scr=document.createElement("script");
scr.src="http://suggestion.baidu.com/su?wd="+val+"&cb=fn";
document.head.appendChild(scr);
}

</script>
</body>
</html>

Ajax通过script src特性加载跨域文件 jsonp的更多相关文章

  1. 加载跨域的HTML页面AJAX

    //下面是谷歌浏览器处理方式,微信端,直接使用微信链接不作处理,,火狐浏览器另行处理... 借鉴地址:http://stackoverflow.com/questions/15005500/loadi ...

  2. 循序渐进Python3(十一) --6--  Ajax 实现跨域请求 jsonp 和 cors

    Ajax操作如何实现跨域请求?       Ajax (XMLHttpRequest)请求受到同源策略的限制.       Ajax通过XMLHttpRequest能够与远程的服务器进行信息交互,另外 ...

  3. 解决跨域问题-jsonp&cors

    跨域的原因 浏览器的同源策略 同源策略是浏览器上为安全性考虑实施的非常重要的安全策略. 指的是从一个域上加载的脚本不允许访问另外一个域的文档属性. 举个例子:比如一个恶意网站的页面通过iframe嵌入 ...

  4. 前后端分离 导致的 静态页面 加载 <script type="module" > 报CORS 跨域错误,提示 blocked by CORS policy

    1.前言 静态页面 加载 <script type="module" > 报CORS 跨域错误,提示Access to script at ftp:///xxx.js ...

  5. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

  6. 重操JS旧业第一弹:Script与JS加载

    不管js被包装成什么样子,最终交给浏览器执行的js都是原生的,都离不开原生js的原理. Script标签纸html中用来加载js的标签,我们知道js可以是来自外部,本地,或者内部一段代码,在这里只讨论 ...

  7. <script>标签的加载解析执行

    转自原文 <script>标签的加载解析执行 看了很多网上的文章,都是大同小异.总结一下.内部原理还没有搞清楚,有机会再学习. 一.<script>标签的加载解析执行顺序 ht ...

  8. 动态script标签同步加载 ps:无打包编译,静态实现静态资源入口动态配置,无编译打包静态资源添加版本号

    /**功能:创建动态标签加载css ,js文件,重点是js文件,利用onloading加递归实现动态标签的同步加载用法:在html文件body底部script内部声明并调用下列函数,obj中写要加载的 ...

  9. 【JavaScript性能优化】------理解Script标签的加载和执行

    1.script标签是如何加载的?当浏览器遇到一个 < script>标签时,浏览器会停下来,运行JavaScript代码,然后再继续解析.翻译页面.同样的事情发生在使用 src 属性加载 ...

随机推荐

  1. 不懂技术也可以轻松开发一款APP

    这是个衣食住行都离不开手机的时代,甚至可以说,我们不用考虑其他的东西,只要拿着手机,就可以出门做自己想做的事情. 这就是手机app的强大之处,覆盖面极广,小到聊天交友,大到投资理财.每次都是app为我 ...

  2. day10 强制类型转换(更新)

    目录 强制类型转换 int() str() list() tuple() set() dict() 总结 强制类型转换 直接看总结 # 定义各个数据类型的值 num_int = 123 num_flo ...

  3. 路飞学城Python-Day29(第四模块-并发编程)

    01-进程与程序的概念 并发:多进程和多线程 进程的概念:进程就是正在执行的过程,一个应用程序不是进程,只有应用程序启动以后才能说是进程,进程是一个抽象的概念,起源于操作系统 02-操作系统介绍 应用 ...

  4. baidu练习/html/css

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. IOS - 6\7下UINavigationBar的颜色的方法改变 ——转载http://www.th7.cn/Program/IOS/201310/155057.shtml

    IOS7下设置UINavigationBar的颜色的方法已经改变(当然如果是用自定义图片的话请忽略---) 首先是区别iOS7和之前版本的方法如下: //如果是iOS7以前的话if (floor(NS ...

  6. [luogu 2568] GCD (欧拉函数)

    题目描述 给定整数N,求1<=x,y<=N且Gcd(x,y)为素数的数对(x,y)有多少对. 输入输出格式 输入格式: 一个整数N 输出格式: 答案 输入样例#1: 4 输出样例#1: 4 ...

  7. el-select 根据value查询其对应的label值

    <el-form-item label="库位" prop="goodsLocationId" > <el-col :span="1 ...

  8. tcpdump的使用以及参数详解

    平时分析客户端和服务器网络交互的问题时,很多情况下需要在客户端和服务器抓包分析报文.一般win下抓包使用WireShark即可,但是linux下就需要用到tcpdump了,下面是一些对于tcpdump ...

  9. jvm 虚拟机参数_新生代内存分配

    1.参数 -Xmn 设置新生代的大小,设置一个比较大的新生代会减少老年代的大小,这个参数对系统性能以及 GC 行为影响很大,新生代大小一般设置为真个堆内存的1/3到1/4 -XX:SurvivorRa ...

  10. ZJU 2605 Under Control

    Under Control Time Limit: 2000ms Memory Limit: 65536KB This problem will be judged on ZJU. Original ...