<!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. 其他信息: 实体类型 xxxxx 不是当前上下文的模型的一部分。

    我是手动添加的EF类的,   解决方法: 没有在DbContext 添加  public virtual DbSet<xxx> xxxx{ get; set; } 导致不在上下文中

  2. ClamAV学习【2】——clamscan入口函数浏览

    就简单给代码加上些注释,方便理解.第一次浏览,应该会有不正确的理解.后面会继续学习修改. 文件:clamscan\clamscan.c 代码如下: nt main(int argc, char **a ...

  3. GO学习笔记 - 数据类型推导

    官方教程:https://tour.go-zh.org/basics/14 在定义一个变量却并不显式指定其类型时(使用 := 语法或者 var = 表达式语法), 变量的类型由(等号)右侧的值推导得出 ...

  4. java学习笔记—使用HttpSession实现QQ的访问记录（31）

    1. 编写QQ空间数据类(QQS.java) public class QQS { private static LinkedHashMap<Integer, String> qqs = ...

  5. “全栈2019”Java第九十章：内部类可以向上或向下转型吗？

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...

  6. 护网杯圆满结束，还不满足？不如来看看大佬的WP扩展思路~

    护网杯预选赛 WP转载自:https://qingchenldl.github.io/2018/10/13/%E6%8A%A4%E7%BD%91%E6%9D%AFWP-BitPwn/#more WEB ...

  7. 学习xss模拟构造攻击（第一篇）

    本文作者:i春秋签约作家——rosectow 0×00前言 XSS又名叫CSS全程(cross site scriptting),中文名跨站脚本攻击,目前网站的常见漏洞之一,它的危害没有像上传漏洞,s ...

  8. RHEL 7 下内存管理小记

    RHEL 7 下内存管理小记 一.Overview 众所周知,在 Linux 操作系统中有三个目录非常有趣好玩. /dev /run /proc 一个个解释下,/dev 用于对特殊设备(BTW:特殊设 ...

  9. 多并发编程基础 之进程 Process

    原贴  https://www.cnblogs.com/gbq-dog/p/10299663.html 1. 进程的理论知识 1.1 操作系统的背景知识 顾名思义,进程即正在执行的一个过程.进程是对正 ...

  10. JQ 文件上传

    var formData = new FormData(); var name = $("input").val(); formData.append("file&quo ...