1. <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
    请输入关键词<input id="keyword" type="text" value="" onkeyup="sugesst()"/>
    <ul id="list">
  2.  
  3. </ul>
    <script>
        //http://suggestion.baidu.com/su?wd='+keyword+'&cb=show
        function show(allData) {
            var data = allData.s;
            /*var str='';
            data.forEach(function (item) {
                str+='<li>'+item+'</li>';
                document.querySelector("#list").innerHTML=str;
            });
            if(document.querySelector("#keyword").value==""){
                document.querySelector("#list").innerHTML="";
            }*/
            //上边太麻烦，用map，map本身有返回值
            var strArr=data.map(function(item) {
               return '<li>'+item+'</li>';
            }).join();
            document.querySelector("#list").innerHTML=strArr;
            console.log(typeof strArr);
        }
        function sugesst() {
            var script = document.createElement("script");
            var keyword=document.querySelector("#keyword").value;
            script.src = 'http://suggestion.baidu.com/su?wd=' + keyword + '&cb=show';
            document.querySelector("body").appendChild(script);
        }
    </script>
    </body>
    </html>

jsonp_百度联想的更多相关文章

  1. 网络系列之 jsonp 百度联想词

    jsonp 可以跨域,ajax 不可以,ajax 会受到浏览器的同源策略影响,何为同源策略? 同源策略就是,如果 A 网站 想拿 B网站里的资源, 那么 有三个条件, 你得满足才能拿. 第一个:域名相 ...

  2. SSH综合练习-仓库管理系统-第二天

    SSH综合练习-仓库管理系统-第二天 今天的主要内容: 货物入库 页面信息自动补全回显功能:(学习目标:练习Ajax交互) 根据货物简记码来自动查询回显已有货物(Ajax回显) 根据货物名来自动查询补 ...

  3. 初学pyhon的几个练习小程序

    一.概述 此程序示例为博主根据路飞学城的python的作业而写的(博主也是python初学者,仅花了99元报了路飞学城的python入门14天集中营3期网络课堂班),此程序非常适合python初学者拿 ...

  4. 计算机网络之JSONP跨域

    JSONP跨域实现原理 百度联想词跨域实现 一.JSONP跨域实现原理 1.Web页面使用<script>引入JS文件时不受同源策略的影响.准确的说,所有拥有src属性的标签都不受同源策略 ...

  5. Day2课后作业：三级菜单简单版

    menu = { '北京':{ '海淀':{ '五道口':{ 'soho':{}, '网易':{}, '谷歌':{} }, '中关村':{ '爱奇艺':{}, '汽车之家':{}, 'youku':{ ...

  6. 自定义chrome新标签页

    [跳转GitHub] chromeNewTab 自定义chrome新标签页.由于不想发布到chrome应用商店,因此搜了一下不用开发者模式就能用的方法. 使用说明 下载chrome的一个[window ...

  7. 新建Chrome标签页，极简+自用

    [跳转GitHub] chromeNewTab 已经入坑Chrome应用开发者,可以去:[应用商店地址]直接添加使用. 使用说明 下载chrome的一个[window组策略文件],解压文件后找到(\p ...

  8. SEO优化技术的简介

    严格来讲,seo技术没有所谓的严格的黑帽与白帽之分.即使是正常的301重定向,在某些情况下也能作用于黑帽seo技术.我们能判定一个人是真正的好人还是坏人么?答案是否定的.之所以解密所谓的黑帽seo,是 ...

  9. selenium定位元素方法汇总

    #打开网页前三步 from selenium import webdriver driver=webidriver.Chrome() driver.get("https://www.baid ...

随机推荐

  1. C++ 模板和 C# 泛型之间的区别（C# 编程指南）

    C# 泛型和 C++ 模板都是用于提供参数化类型支持的语言功能. 然而,这两者之间存在许多差异. 在语法层面上,C# 泛型是实现参数化类型的更简单方法,不具有 C++ 模板的复杂性. 此外,C# 并不 ...

  2. 在 Cef 中实现 C++ 与 JavaScript 交互场景分析

    此文已由作者邓佳佳授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验 本文主要介绍 CEF 场景中 C++ 和 JavaScript 交互(以下简称 JS Bridge)中的一些重 ...

  3. 「ZJOI 2010」 排列计数

    题目链接 戳我 \(Solution\) 其实我们可以发现这题等价于让你求: 用\(1\)~\(n\)的数组成一个完全二叉树使之满足小根堆性质的方案数 于是我们可以考虑\(dp\) 假设我们现在在\( ...

  4. String类的操作方法

    因String属于java核心包lang包的东西,所以不需要导包! /* * 字符串操作 * */ String name = "jck"; String name1 = &quo ...

  5. AutoCad2012新增类AcRxVariablesDictionary 可以获取所有变量名和值

    //AutoCad2012新增类 获取所有变量名和值 AcRxVariablesDictionary *dic=AcRxVariablesDictionary::get(); const AcArra ...

  6. 使用服务器上的Jupyter notebook。

    1.jupyter notebook --generate-config #产生配置文件 2.from notebook.auth import passwd #进入python环境,生成密码密文.第 ...

  7. MySQL之查看数据库编码

    MySQL之查看数据库编码

  8. 索引（Awakening！）

    orz写个索引,方便日后复习和补充. 目前笔记还不是很多,而且写得比较烂,望各位到访的巨佬谅解. 大概可以算作一个归纳总结? ……没链接的还没开始写或者没写完,而且不知道什么时候才能写完(咕咕咕) 一 ...

  9. Python flask Reason: image not found libmysqlclient.21.dylib

    Python flask Reason: image not found libmysqlclient.21.dylib 折腾了半个下午,在这里找到了答案,在此记录一下,以免后人躺坑 错误提示: Im ...

  10. ator自动生成mybatis配置和类信息

    generator自动生成mybatis的xml配置.model.map等信息: 1.下载mybatis-generator-core-1.3.2.jar包.        网址:http://cod ...