<!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">

</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. css+html+JQuery 万能弹出层，居中显示

    function ShowMsg(str) {//要提示的文字 $(".payment_time_mask").remove(); $("body").appe ...

  2. linux学习之用户的切换

    普通用户: 输入su 用户名,点击Enter Root用户: 输入su root,点击Enter 输入登录密码,点击Enter

  3. python网络编程--socket,网络协议,TCP

    一. 客户端/服务端架构(用到网络通信的地方) 我们使用qq.微信和别人聊天,通过浏览器来浏览页面.看京东的网站,通过优酷.快播(此处只是怀念一下)看片片啥的等等,通过无线打印机来打印一个word文档 ...

  4. Android IPC机制—Binder的工作机制

    进程和线程的关系 IPC机制即为跨进程通信,是inter-Process Communication的缩写.是指两个进程之间进行通信.在说进程通信之前,我们的弄明白什么是线程,什么是进程.进程和线程是 ...

  5. CentOS6.5下samba服务

    为减少错误已提前关掉了SELinux,防火墙. 安装rpm包: samba-3.6.9-164.el6.x86_64.rpm 启动检测:samba服务可以正常启动!(证明RPM安装正常) 配置文件位置 ...

  6. C语言多线程编程一

    1. Windows下同时打开多个对话框: #include <Windows.h> #include <process.h> //创建线程 void runmsg(void ...

  7. 支持向量机通俗导论（SVM学习）

    1.了解SVM 支持向量机,因其英文名为support vector machine,故一般简称SVM,通俗来讲,它是一种二类分类模型,其基本模型定义为特征空间上的间隔最大的线性分类器,其学习策略便是 ...

  8. 开源代码MyCommons

    MyCommons是我在开发Android App中,经过多个项目的实践和应用,上十次修改的,总结起来的代码,目的是希望大家能够快速的完成项目的开发. 主要也是参考了afinal和xutils2个框架 ...

  9. iOS --UIScrollView的学习（一）

    1.为什么使用UIScrollView 因为移动设备的屏幕大小是极其有限的,因此直接展示在用户眼前的内容也相当有限,当展示的内容较多,超出一个屏幕时,用户可通过滚动手势来查看屏幕以外的内容普通的UIV ...

  10. StarUML使用简明教程

    最近了解到StarUML比较多,所以写一篇教程供大家参考,不足支持,请见谅. StarUML(简称SU),是一种创建UML类图,生成类图和其他类型的统一建模语言(UML)图表的工具.StarUML是一 ...