黑马程序员360搜索例子-2020更新代码

简介: 黑马程序员360搜索例子-2020更新代码

很多自学的小伙伴可能都遇到过这样的一个问题,就是代码跟教程的一摸一样,但是视频没错但自己敲出来却错了,原因是多样的,但是软件本身的更新迭代应该是我们优先考虑的,就像日前在B站看的黑马程序员的jQuery的Ajax应用–利用360搜索API制作一个关键词联想的例子。

附上代码,避免一些小伙百度不出解决方法。。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>360联想词</title>
    // 引入jQuery
    <script src="../js/jquery-1.12.4.min.js"></script>
    <script>
        $(function(){
            $("#btn01").click(function(){
                let $txt = $("#txt01").val();
                $.ajax({
                    url: "https://sug.so.360.cn/suggest",
                    type: "get",
                    dataType: "jsonp",
                    data: { word: $txt },
                    })
                    // 成功则传入一个对象
                    .done(function (dat) {
                    console.log(dat);
                    // 清空历史记录
                    $(".content").empty();
                    let $content = dat.result;
                    // alert($content.length);
                    for(let i=0; i<$content.length; i++)
                    {
                        let $newLi = $("<li></li>");
                        $newLi.html($content[i].word).appendTo(".content");
                    }
                    })
                    .fail(function () {
                    alert("服务器超时");
                    });
            })
        })
    </script>
  </head>
  <body>
    <!-- https://sug.so.360.cn/suggest?callback=suggest_so&encodein=utf-8&encodeout=utf-8&format=json&src=so_home&fields=word&word=cls&huid=11AvRL1L1qRgMhJD7YRnHk5o%2BzaxCUyGago5oIAciaxLk%3D&llbq=A5%2CB5%2CC5%2CD5&cache=&id= -->
    <label>请输入要搜索的关键词:</label><input type="text" name="" id="txt01"><input type="button" name="" value="搜索" id="btn01">
    <div class="content"></div>
  </body>
</html>
相关文章
|
Ubuntu 测试技术 Linux
百度搜索:蓝易云【Ubuntu系统打RT实时内核补丁教程】
现在,你已经成功在Ubuntu系统上打上RT实时内核补丁,并且系统将使用RT内核运行,提供更好的实时性能。请注意,内核编译和替换是一项复杂的操作,建议在实施前备份重要数据,并在测试环境中进行验证。
276 2
|
人工智能 安全
Stable Diffusion:网页版 体验 / AI 绘图
Stable Diffusion:网页版 体验 / AI 绘图
2679 0
|
缓存 NoSQL Java
Spring Boot与Redis:整合与实战
【10月更文挑战第15天】本文介绍了如何在Spring Boot项目中整合Redis,通过一个电商商品推荐系统的案例,详细展示了从添加依赖、配置连接信息到创建配置类的具体步骤。实战部分演示了如何利用Redis缓存提高系统响应速度,减少数据库访问压力,从而提升用户体验。
573 2
|
存储 API 网络性能优化
OpenStack的块存储卷管理
【8月更文挑战第25天】
325 4
|
存储 监控 NoSQL
redis主从模式,redis哨兵模式,redis集群模式
redis主从模式,redis哨兵模式,redis集群模式
416 1
redis主从模式,redis哨兵模式,redis集群模式
|
算法 UED 异构计算
性能优化在嵌入式系统中的应用
性能优化在嵌入式系统中的应用
300 3
|
人工智能 机器人
Kimi仅用5秒钟就帮我抓取了5页文章素材
Kimi仅用5秒钟就帮我抓取了5页文章素材
416 3
|
开发框架 JavaScript 前端开发
比较两个突出的node.js框架:koa和express
接上文讲述了 koa框架,这边文章比较一下这两个突出的node.js框架:koa和express
|
IDE 数据可视化 开发工具
Spyder
Spyder是一个用于数据科学和计算机视觉的Python集成开发环境(IDE)。它支持多个Python版本,并具有强大的交互式界面,可以帮助用户轻松地进行数据可视化、建模和分析。
691 1
|
Java 数据库连接 计算机视觉
SpringBoot 中的多线程事务处理太繁琐?一个自定义注解直接搞定!
SpringBoot 中的多线程事务处理太繁琐?一个自定义注解直接搞定!