<!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. LeetCode Golang 3. 无重复字符的最长子串

    3. 无重复字符的最长子串 给定一个字符串,请你找出其中不含有重复字符的 最长子串 的长度. 示例 1: 输入: "abcabcbb" 输出: 3 解释: 因为无重复字符的最长子串 ...

  2. node——模块分类，require执行顺序，require注意事项，原理

    node.js模块 在node.js开发中一个文件就可以认为是一个模块. 一.node.js模块分类 核心模块Code Module.内置模块.原生模块 fs http path url ... 所有 ...

  3. ES modules

    注意:这篇文章讲的是正经的es module规范 及浏览器的实现!webpack项目中es module会被parse成commonjs,和这个没大关系! 总结: ES模块加载的主要过程: 构造 —— ...

  4. HBase入门操作 常用命令和增删改查的简单应用操作

    这里启动关闭Hadoop和HBase的顺序一定是: 启动Hadoop—>启动HBase—>关闭HBase—>关闭Hadoop ssh localhost 开启hadoopcd /us ...

  5. django-1-框架介绍

    <<<python虚拟环境>>> 用django框架做web开发必须要用到python虚拟环境,而且一个虚拟环境只能创建一个django项目,如果创建多个djang ...

  6. Hash大法

    内容参考<算法竞赛进阶指南> 之前集训的时候听老师讲过,字符串题目中,hash一般不是正解,但是是一个优秀的暴力,可以拿比较多的部分分. hash涉及内容很多,这里只讨论字符串hash 可 ...

  7. [WPF,XAML] 跳动的心

    原文:[WPF,XAML] 跳动的心 没什么艺术细胞,原谅,原谅! <Canvas Width="0" Height="0"> <Canvas ...

  8. WinServer-AD操作常用powershell命令

    powershell 操作AD常用命令 查询AD中默认的密码策略 Get-ADDefaultDomainPasswordPolicy 查询AD中密码永不过期的用户 Get-ADUser -Filter ...

  9. Java web开发中主要用到的jar包

    1.Java开发中主要用到的jar包介绍:(1)java JDK基础开发包:java包和javax包.书写方式:import java.lang.reflect.InvocationTargetExc ...

  10. 数据共享之相互排斥量mutex

    相互排斥量介绍 相互排斥量能够保护某些代码仅仅能有一个线程运行这些代码.假设有个线程使用相互排斥量运行某些代码,其它线程訪问是会被堵塞.直到这个线程运行完这些代码,其它线程才干够运行. 一个线程在訪问 ...