<!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. 脑图工具MindNode"附属节点"是什么意思 图解

    新手会发现在主节点上无论是按Tab子节点还是按Enter附属节点,都是向右延伸,感觉像没区别? 其实不然,从第二个节点开始,你再按 Tab 或者 Enter 就知道区别了. 废话少说,直接上图. 我觉 ...

  2. ZBrush中Layer层笔刷介绍

    本文我们来介绍ZBrush®中的Layer层笔刷,该笔刷是一种类似梯田效果的笔刷,常用来制作鳞甲和花纹图腾.他还可以用一个固定的数值抬高或降低模型的表面,当笔刷在重合时,笔画重叠部分不会再次位移,这使 ...

  3. 操作mysql操作数据库

    操作数据库 查询数据库:show databases: 增加数据库:create database student default character set uft-8:(设置默认字符集) 删除数据 ...

  4. 洛谷T47092 作业_简单状压动归

    只要注意一下细节就毫无难点了,简简单单状态压缩即可. Code: #include<cstdio> #include<algorithm> using namespace st ...

  5. CF895C Square Subsets (组合数+状压DP+简单数论)

    题目大意:给你一个序列,你可以在序列中任选一个子序列,求子序列每一项的积是一个平方数的方案数. 1<=a[i]<=70 因为任何一个大于2的数都可以表示成几个质数的幂的乘积 所以我们预处理 ...

  6. Could not find result map java.util.HashMap

    Could not find result map java.util.HashMap 找不到结果图java.util.HashMap MyBatis 找不到返回的 'resultMap'!把resu ...

  7. layui select change

    <select lay-filter="test"></select> layui.use([ 'form'], function() { var form ...

  8. 非典型的scala程序及其编译后的结果

    初学Scala Folder structure以及部分代码 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2xldmVyd3lx/font/5a6L5L ...

  9. hdoj 4548 美素数 【打表】

    另类打表:将从1到n的满足美素数条件的数目赋值给prime[n],这样最后仅仅须要用prime[L]减去prime[R-1]就可以: 美素数 Time Limit: 3000/1000 MS (Jav ...

  10. jsp的凝视可能会影响页面载入速度

    在jsp页面使用"<!-- -->"的凝视,凝视里面的java代码还是会得到运行,能够再查看页面源码上看到运行完毕的内容,这样就会让不希望运行的代码得到运行.影响载入速 ...