简单的动漫网站（HTML+SprintBoot网页项目）

已于 2023-10-17 20:47:14 修改
阅读量3.1k 收藏 31
点赞数 5
文章标签： html 前端 java
于 2023-07-20 20:33:25 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_65685799/article/details/131838991
版权

功能：

        1、通过数据库中动漫的播放量数据进行动漫推荐

        2、分类筛选功能，实现动漫的分类筛选，更加有目的性的查看动漫类型

        3、动漫详情功能，对点击的动漫进行后台搜索，展现动漫的详细信息

        4、搜索功能，可以实现模糊搜索

登录/注册

        

前端代码 实现（login.html）：

<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户登录</title>
    <link rel="stylesheet" href="../css/login.css">
    <script src="../js/jQuery-3.6.4.js"></script>
    <script src="../js/login.js"></script>
</head>
 
<body>
    <div id="loginDiv">
        <!-- onsubmit="return false" 关闭form表单提交，使用ajxa提交-->
        <form action="" id="form" onsubmit="return false">
            <h1 >登&emsp;&emsp;录</h1>
            用户名:<input id="userName" type="text"><br>
 
            密&emsp;码:<input id="userPassword" type="password">

            <div>
                <input type="button" id="loginClick" class="button" value="登陆" onclick="login1();">
                <a href="./register.html"><input type="button" style="margin-left:50px;" class="button" value="注册"></a>
            </div>
        </form>
    </div>
 

</body>
</html>

注册前端代码（regester.html）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册界面</title>
<link rel="stylesheet" href="../css/register.css">
<script src="../js/jQuery-3.6.4.js"></script>
<script src="../js/register.js"></script>
</head>
<body>
    <div class="box">    <!--表单信息-->
        <form action="" method="post"><!-- onsubmit=" return YanZheng();" 表单验证-->
            <div class="inputs">
                <div><h1>用户注册</h1></div>
                <br>
                账&emsp;&emsp;号:
                <input type="text" name="" id="userName" onblur= "userName1();">
                <br>
                <span id = "userNameTip"></span>
                <br>
                联系电话:
                <input type="text" id="userPhone" onblur = "userPhone1();">
                <br>
                <span id = "userPhoneTip"></span>
               
                <br>
                密&emsp;&emsp;码:
                <input type="password" name="" id="userPassword" onblur = "userPassword1();">
                <br>
                <span id = "userPasswordTip"></span>
                <br>
                确定密码:
                <input type="password" name="" id="userPassword2" onblur = "userTruePassword();">
                <br>
                <span id = "userPassword2Tip"></span>
                <br>
            </div>
           <div class="selects">
            性&emsp;&emsp;别:
            <input type="radio" name="sex" id="" onblur = "userSex1();" value="男">男
            <input type="radio" name="sex" id=""  onblur = "userSex1();" value="女">女
            <br>
            <span id = "sexTip"></span>
            <br>
            爱&emsp;&emsp;好:
            <input type="checkbox" name="favor" id="" value="运动">运动
            <input type="checkbox" name="favor" id="" value="读书">读书
            <input type="checkbox" name="favor" id="" value="娱乐游戏">娱乐游戏
            <br>
            <span id = "checkboxTip"></span>
            <br>
            省&emsp;&emsp;份:
            <select id="userProvince">
                <option value="贵州省">贵州省</option>
                <option value="广东省">广东省</option>
                <option value="云南省">云南省</option>
                <option value="浙江省">浙江省</option>
                <option value="广西省">广西省</option>
                
            </select>
            <br>
            <span id = "userProvinceTip"></span>
            <br>
            市区 / 县:
            <select id="userMarket">
                <option value="凯里">凯里</option>
                <option value="贵阳">贵阳</option>
                <option value="黔西南">黔西南</option>
                <option value="遵义">遵义</option>
                <option value="昆明">昆明</option>
            </select>
            <br>
            <span id = "userMarketTip"></span>
           </div>
           <div class="buttons">
                <!-- onclick="YanZheng()" -->
                <input type="button" value="提交" class = "button" id="sbt" onclick="register();">
                <input type="reset" value="重置">
           </div>
           
        </form>
    </div>
    
</body>
</html>

网站主页：

 前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>动漫之家</title>
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/bootstrap.css">
    <link rel="stylesheet" href="../bootstrap-icons-1.10.5/font/bootstrap-icons.css">
    <script src="../js/jQuery-3.6.4.js"></script>
    <script src="../js/bootstrap.bundle.min.js"></script>
    <script src="../js/index.js"></script>
</head>
<body>
    <div class="box">
        <div class="heard">
            <div class="left">
                    <!-- 左边导航栏 -->
                    <ul class="left_ul">
                    <li class="left_li">
                        <img src="../img/logou.png" alt="">
                     </li>
                    <li class="left_li" id="zhuti">
                        <a class="left_a" href="#">哔哩哔哩漫画</a>
                    </li>
                    <li class="left_li">
                        <a class="left_a" href="#">主站</a>
                    </li>
                    <li class="left_li">
                        <a class="left_a" href="#" style="color:  rgb(10, 208, 243);">首页</a>
                    </li>
                    <li class="left_li">
                        <a class="left_a"  onclick="fanlei(this)">分类</a>
                    </li>
                    <li class="left_li">
                        <a class="left_a" href="#">更新</a>
                    </li>
                    <li class="left_li">
                        <a class="left_a" href="#">排行榜</a>
                    </li>
                    </ul>
            </div>
            <!-- 搜索框 -->
            <div class="center">
                <input type="text" id="sousuo"  onsubmit ="sousuo()">
                <i class="bi bi-search" onclick="sousuo()"></i>
            </div>
            <div class="right">
                <!-- <a href="login.html">登入</a>
                <a href="register.html">注册</a> -->
               <div class="gerenzhongxing">
                <div>个人中心</div>
                <div class="gerenzhongxing_list">
                    <ul>
                        <li>账户管理</li>
                        <li>观看历史</li>
                        <li>修改密码</li>
                        <li>退出登录</li>
                    </ul>
                </div>
               </div>
            </div>
            
            <!-- 轮播 -->
            <div id="demo" class="carousel slide" data-bs-ride="carousel">

                <!-- 指示符 -->
            <div class="carousel-indicators">
                <button type="button" data-bs-target="#demo" data-bs-slide-to="0" class="active"></button>
                <button type="button" data-bs-target="#demo" data-bs-slide-to="1"></button>
                <button type="button" data-bs-target="#demo" data-bs-slide-to="2"></button>
                <button type="button" data-bs-target="#demo" data-bs-slide-to="3"></button>
                <button type="button" data-bs-target="#demo" data-bs-slide-to="4"></button>
            </div>
            
            <!-- 轮播图片 -->
            <div class="lunbo">
                <div class="carousel-inner" style="height: 400px;">
                    <div class="carousel-item active">
                    <img src="../img/lunbo4.avif" class="d-block" style="width:100%">
                    </div>
                    <div class="carousel-item">
                    <img src="../img/lunbo2.avif" class="d-block" style="width:100%">
                    </div>
                    <div class="carousel-item">
                    <img src="../img/lunbo3.avif" class="d-block" style="width:100%">
                    </div>  <div class="carousel-item">
                        <img src="../img/lunbo5.avif" class="d-block" style="width:100%">
                    </div>
                    </div>  <div class="carousel-item">
                        <img src="../img/lunbo6.avif" class="d-block" style="width:100%">
                    </div>
                </div>
                
                <!-- 左右切换按钮 -->
                <button class="carousel-control-prev" type="button" data-bs-target="#demo" data-bs-slide="prev">
                    <span class="carousel-control-prev-icon"></span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#demo" data-bs-slide="next">
                    <span class="carousel-control-next-icon"></span>
                </button>
                </div>
            </div>
            

            <!-- 中部内容 -->
            <div class="body">
                <!-- 导航栏 -->
                <div class="heard">
                    <ul>
                        <li>
                            <a class = "fenlei" href="#" onclick="fanlei(this)">漫画改</a>
                        </li>
                        <li>
                            <a  class = "fenlei" href="#" onclick="fanlei(this)">热血</a>
                        </li>
                        <li>
                            <a  class = "fenlei" href="#" onclick="fanlei(this)">战斗</a>
                        </li>
                        <li>
                            <a  class = "fenlei" href="#" onclick="fanlei(this)">搞笑</a>
                        </li>
                        <li>
                            <a class = "fenlei" href="#" onclick="fanlei(this)">奇幻</a>
                        </li>
                        <li>
                            <a class = "fenlei" href="#" onclick="fanlei(this)">校园</a>
                        </li>
                        <li>
                            <a class = "fenlei" href="#" onclick="fanlei(this)">冒险</a>
                        </li>
                        <li>
                            <a  class = "fenlei" href="#" onclick="fanlei(this)">小说改</a>
                        </li> 
                        <li>
                            <a  class = "fenlei" href="#" onclick="fanlei(this)">穿越</a>
                        </li>
                        <li>
                            <a  class = "fenlei" onclick="fanlei(this)">日常</a>
                        </li>
                    </ul>
                   
                    <div class="right">
                        <span onclick="fanlei(this)">查看全部</span>
                        <i style="font-size: 14px;" class="bi bi-chevron-right"></i>
                    </div>
                    <!-- <div class="tuiJian">
                        <i class="bi bi-balloon-heart"></i>
                        <h1>为你推荐</h1>
                    </div>
                    <div class="dongMan">
                        <ul id  ="neiRong">
                            <li>
                                <img id = 'tuPian' src="../img/测试.png" alt="">
                                <span><i>9.5</i></span>
                                <br>
                                <p> 鬼灭之刃</p> 
                                <span class="jianjie">鬼其利剑</span>
                            <li>
                        </ul>
                    </div> -->
                    <div class="tuijian">
                        <div class="left">
                            <i class="bi bi-balloon-heart"></i>
                            <h1>为你推荐</h1>
                        </div>
                        <div class="dongMan">
                            <ul id  ="tuijian">
                                <!-- <li>
                                    <img id = 'tuPian' src="../img/测试.png" alt="">
                                    <span><i>9.5</i></span>
                                    <br>
                                    <p> 鬼灭之刃</p> 
                                    <span class="jianjie">鬼其利剑</span>
                                <li> -->
                            </ul>
                        </div>
                    </div>
                    <div class="rexie">
                        <div class="left">
                            <i class="bi bi-caret-right-square-fill"></i>
                            <h1>热血</h1>
                        </div>
                        <div class="right">
                            <span onclick="fanlei(this)">查看更多</span>
                            <i style="font-size: 14px;" class="bi bi-chevron-right"></i>
                        </div>
                        <div class="dongMan">
                            <ul id  ="rexie">
                                <!-- <li>
                                    <img id = 'tuPian' src="../img/测试.png" alt="">
                                    <span><i>9.5</i></span>
                                    <br>
                                    <p> 鬼灭之刃</p> 
                                    <span class="jianjie">鬼其利剑</span>
                                <li> -->
                            </ul>
                        </div>
                    </div>
                    <div class="xiaoyuan">
                        <div class="left">
                            <i class="bi bi-google-play"></i>
                            <h1>校园</h1>
                        </div>
                        <div class="right">
                            <span onclick="fanlei(this)">查看更多</span>
                            <i style="font-size: 14px;" class="bi bi-chevron-right"></i>
                        </div>
                        <div class="dongMan">
                            <ul id  ="xiaoyuan">
                                <!-- <li>
                                    <img id = 'tuPian' src="../img/测试.png" alt="">
                                    <span><i>9.5</i></span>
                                    <br>
                                    <p> 鬼灭之刃</p> 
                                    <span class="jianjie">鬼其利剑</span>
                                <li> -->
                            </ul>
                        </div>
                    </div>
                    <div class="dibu">
                        <p style="margin-top:50px;">刀剑神域 日本动漫 新妹魔王的契约者 进击的巨人 学园默示录 新番动漫 亲吻姐姐 电锯人动漫</p>
                        <p>本网站提供的最新动漫资源均系收集于各大视频网站，本网站只提供web页面服务，并不提供影片资源存储，也不参与录制、上传</p>
                           <p> 若本站收录的链接无意侵犯了贵司版权，请邮箱联系我们，我们会及时处理相关内容，谢谢！邮箱：mddmlianxi#hotmail.com</p>
                            <p>Copyright ©2020-2022 www.mandao.tv All Rights Reserved · 百度地图 · 谷哥地图</p>           
                           <p> 湘ICP备20225100号</p>
                    </div>
                </div>
                  
            </div>
        </div>
        
    </div> 
</body>
</html>

 分类功能：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="../css/fenlei.css">
    <link rel="stylesheet" href="../css/bootstrap.css">
    <link rel="stylesheet" href="../bootstrap-icons-1.10.5/font/bootstrap-icons.css">
    <script src="../js/jQuery-3.6.4.js"></script>
    <script src="../js/bootstrap.bundle.min.js"></script>
    <script src="../js/fenlei.js"></script>
    <title>分类</title>
</head>
<body>
<div class="box">
    <div class="heard">
        <div class="left">
                <!-- 左边导航栏 -->
                <ul class="left_ul">
                <li class="left_li">
                    <img src="../img/logou.png" alt="">
                    </li>
                <li class="left_li" id="zhuti">
                    <a class="left_a" href="#">哔哩哔哩漫画</a>
                </li>
                <li class="left_li">
                    <a class="left_a" href="#">主站</a>
                </li>
                <li class="left_li">
                    <a class="left_a" href="./index.html">首页</a>
                </li>
                <li class="left_li">
                    <a class="left_a" style="color:  rgb(10, 208, 243);" href="#">分类</a>
                </li>
                <li class="left_li">
                    <a class="left_a" href="#">更新</a>
                </li>
                <li class="left_li">
                    <a class="left_a" href="#">排行榜</a>
                </li>
                </ul>
        </div>
        <!-- 搜索框 -->
        <!-- <div class="center">
            <input type="text">
            <i class="bi bi-search"></i>
        </div> -->
        <div class="center">
            <input type="text" id="sousuo"  onsubmit ="sousuo()">
            <i class="bi bi-search" onclick="sousuo()"></i>
        </div>
        <div class="right">
            <a href="login.html">登入</a>
            <a href="register.html">注册</a>
        </div>

        <!-- 分类标题 -->
        <div class="fenlei">
            <div class="ticai">
                <ul>
                    <li >
                        <span class="ticaiHeard">题材</span>
                    </li>
                    <li>
                        <a href="#"  id="quanbu">全部</a>
                    </li>
                    <li>
                        <a href="#" id = "manhua" onclick="fenlei2(this)">漫画改</a>
                    </li>
                    <li>
                        <a  href="#" id = "rexie" onclick="fenlei2(this)">热血</a>
                    </li>
                    <li>
                        <a  href="#" id="zhandou" onclick="fenlei2(this)">战斗</a>
                    </li>
                    <li>
                        <a href="#" id="gaoxiao" onclick="fenlei2(this)">搞笑</a>
                    </li>
                    <li>
                        <a href="#" id="qihuan"  onclick="fenlei2(this)">奇幻</a>
                    </li>
                    <li>
                        <a href="#" id="xiaoyuan" onclick="fenlei2(this)">校园</a>
                    </li>
                    <li>
                        <a href="#" id="maoxian" onclick="fenlei2(this)">冒险</a>
                    </li>
                    <li>
                        <a href="#" id="xiaoshuo" onclick="fenlei2(this)">小说改</a>
                    </li> 
                    <li>
                        <a href="#" id="chuanyue" onclick="fenlei2(this)">穿越</a>
                    </li>
                    <li>
                        <a href="#" id = "rechang" onclick="fenlei2(this)">日常</a>
                    </li>
                </ul>
            </div>
            <div class="diqu">
                <ul>
                    <li >
                        <span class="ticaiHeard">地区</span>
                    </li>
                    <li>
                        <a style="color:  rgb(10, 208, 243);"  href="#" >全部</a>
                    </li>
                    <li>
                        <a href="#" >中国</a>
                    </li>
                    <li>
                        <a  href="#" >韩国</a>
                    </li>
                    <li>
                        <a  href="#" >日本</a>
                    </li>
                    <li>
                        <a href="#" >其他</a>
                    </li>
                </ul>
            </div>
            <div class="jingdu">
                <ul>
                    <li >
                        <span class="ticaiHeard">进度</span>
                    </li>
                    <li>
                        <a style="color:  rgb(10, 208, 243);" href="#" >全部</a>
                    </li>
                    <li>
                        <a href="#" >连载</a>
                    </li>
                    <li>
                        <a  href="#" >完结</a>
                    </li>
                </ul>
            </div>
            <div class="paixu">
                <ul>
                    <li >
                        <span class="ticaiHeard">排序</span>
                    </li>
                    <li>
                        <span style="color:  rgb(10, 208, 243);"  >人气推荐</span>
                    </li>
                    <li>
                        <a href="#" >更新时间</a>
                    </li>
                    <li>
                        <a  href="#" >上架时间</a>
                    </li>
                </ul>
            </div>
            <!-- 动漫 -->
            <div class="dongMan">
                <ul id  ="list">
                    <!-- <li>
                        <img id = 'tuPian' src="../img/测试.png" alt="">
                        <span><i>9.5</i></span>
                        <br>
                        <p> 鬼灭之刃</p> 
                        <span class="jianjie">鬼其利剑</span>
                    <li> -->
                </ul>
            </div>
        </div>
</div>
</body>
</html>

搜索功能：

前端代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/sousuo.css">
    <script src="../js/jQuery-3.6.4.js"></script>
    <script src="../js/sousuo.js"></script>
</head>
<body>
    <div class="box">
        <div class="heard">
            <div class="left1">
                <img src="../img/bilibili.png" alt="">
            </div>
            <div class="conter">
                <ul>
                    <li>
                        <a chref="#" >主站</a>
                    </li>
                    <li>
                        <a  href="./index.html" >首页</a>
                    </li>
                    <li>
                        <a  href="#" onclick="fanlei(this)">分类</a>
                    </li>
                    <li>
                        <a  href="#" >排行榜</a>
                    </li>
                    <li>
                        <a href="#" >更新</a>
                    </li>
                    <li>
                        <a href="#" >漫画</a>
                    </li>
                    <li>
                        <a href="#" >赛事</a>
                    </li>
                </ul>
            </div>
            <div class="right">
               <ul>
                <li>举报</li>
                <li>收藏</li>
                <li>观看历史</li>
               </ul>
            </div>
        </div>
        </div>
        <div class="center">
            <div class="inputs">
                <input type="text"  >
                <button>搜索</button>
            </div>
            <div class="input_list">
                <ul>
                    <li style="color: red;">综合</li>
                    <li>视频</li>
                    <li>番剧</li>
                    <li>影视</li>
                    <li>直播</li>
                    <li>专栏</li>
                    <li>用户</li>
                </ul>
            </div>
            <div class="dongman">
                <div class="faxian">
                    <p>搜索发现</p>
                    <ul class="faxian_list">
                        <li>1.鬼灭之刃</li>
                        <li>2.因为害怕痛所以全点防御</li>
                        <li>3.咒术回战</li>
                        <li>4.Re：从零开始的异世界生活 第二季 前半</li>
                        <li>5.OVERLORD</li>
                        <li>6.在下坂本，有何贵干？</li>
                        <li>7.四月是你的谎言</li>
                        <li>8.刀剑神域 爱丽丝篇 异界战争</li>
                        <li>9.世界顶尖的暗杀者,转生为异世界贵族</li>
                        <li>10.异度侵入 ID:INVADED</li>
                    </ul>
                </div>
                <ul id="domman_list">
                    <!-- <li id="">
                        <img src = "../img/测试.png">
                        <span id="title">鬼灭之刃&emsp;<span style="color: rgb(15, 235, 70);font-size: 16px;">[可播放]</span></span>
                        <p style="margin-left: 90px;color: rgb(174, 177, 180);">——鬼灭之带</p>
                        <i id="pinlun">9.8</i>
                        <p >播放量：9047</p>
                        <p>评论量：67342789853</p>
                        <p>动漫类型：动漫改&热血&奇幻</p>
                        <p id="jianjie">剧情简介：还能是滴哦飞机囧圣诞节佛山的看氛围和多福及饿哦山东黄金覅和划分iOS的何炅是电话费hi欧等级划分iOS的Hi好hi府文化的覅货架上低耦合剂佛未激活iOS等哈就hi介绍费his火箭还是发his大好人覅搜地方佛经看妇女几米宽的近几年覅哦都是就oops的风景</p>
                    </li> -->
                   
                </ul>
            </div>
        </div>
        <div class="dibu">
            <p >刀剑神域 日本动漫 新妹魔王的契约者 进击的巨人 学园默示录 新番动漫 亲吻姐姐 电锯人动漫</p>
            <p>本网站提供的最新动漫资源均系收集于各大视频网站，本网站只提供web页面服务，并不提供影片资源存储，也不参与录制、上传</p>
            <p> 若本站收录的链接无意侵犯了贵司版权，请邮箱联系我们，我们会及时处理相关内容，谢谢！邮箱：mddmlianxi#hotmail.com</p>
            <p>Copyright ©2020-2022 www.mandao.tv All Rights Reserved · 百度地图 · 谷哥地图</p>           
            <p> 湘ICP备20225100号</p>
        </div>
    </div>
</body>
</html>

后端部分代码：

package com.Web.controller;


import com.Web.dao.FanjuDao;
import com.Web.entity.Fanju;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import static jdk.nashorn.internal.objects.NativeDebug.map;


//前后端交互
@RestController


@RequestMapping("/fanju")//请求父路径
public class FanjuController {
    @Autowired//将FanjuDao注入文本中
    FanjuDao fanjuDao;

    //传输fanju数据库数据给前端的方法
    @GetMapping("/index") //localhost:8086/Fanju/index
    public HashMap<String,Object> list(){
        HashMap<String,Object> map = new HashMap<>();
        //查看所有数据
        List<Fanju> list = fanjuDao.selectList(null);
        map.put("data",list);
        map.put("code",200);
        return map;
    }

    //读取数据，进行判断，传输数据返回给前端
    @GetMapping("/info")
    public HashMap<String,Object> setInfo(Fanju fanju){
        //声明一个hashMop,用于存储响应给前端数据
        HashMap<String, Object> map = new HashMap<>();
        //钩造查询条件
        QueryWrapper<Fanju> wrapper = new QueryWrapper<>();
        wrapper.eq("id",fanju.getId());//查询id
        List<Fanju> list = fanjuDao.selectList(wrapper);
        map.put("data",list);
        map.put("code",200);
        return map;
    }


    //接受传入数据，查询数据，返回给前端
    @GetMapping("/fenlei")  //localhost:8086/fanju/fenlei
    public HashMap<String,Object> Fenlei(String str){  //如： 热血   传入String类型
        HashMap<String, Object> map = new HashMap<>();
        //查询所有数据
        List<Fanju> list = fanjuDao.selectList(null);
        //定义变量存储返回值
        List<Fanju> data = new ArrayList<>();
        //判断前两百条数据
        for (int i = 0; i < 200; i++) {
            //分割字符串
            String[] split = list.get(i).getFanjuType1().split("&");
            for (String s : split) {
                //如果字段相等，追加到data泛型，返回给前端
                if(s.equals(str)){
                    //添加数据
                   data.add(list.get(i));
                }
            }
        }
        map.put("data",data);
        map.put("code",200);
        return map;
    }

    //接受传入数据，查询搜索数据，返回给前端
    @GetMapping("/sousuo")
    public HashMap<String,Object> select(String str){
        HashMap<String, Object> map = new HashMap<>();
        String str1 = "%"+str+"%";  //周围添加一个或者多个字符
        //构造查询条件
        QueryWrapper<Fanju> wrapper = new QueryWrapper<>();
        //正则表达式,进行模糊搜索
        wrapper.like("fanju_title",str1);
        //查询所有数据
        List<Fanju> list = fanjuDao.selectList(wrapper);
        if (list !=null){
            map.put("data",list);
            map.put("code",200);
            return map;
        }else {
            map.put("map", "数据为空");
            map.put("code", 500);
            return map;
        }
    }
}

 完成代码可以去到我的git上面下载使用：动漫网站: 建议模仿哔哩哔哩动漫实现动漫网站，练习html，css，Java等代码

 

一个不会写代码的码农
关注
  • 5
    点赞
  • 踩
  • 31
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
使用HBuilder制作一个简单的HTML5动漫网页——小林家的龙女仆 HTML+CSS学生个人网页制作 学生静态HTML网页源码 dreamweaver网页作业 简单网页课程成品
qq_38515154的博客
04-23 287
1网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了Logo（源文件）所需的知识点。
vue+springboot网页商城项目
06-12
5个github上的vue+springboot商城项目，内涵不同的操作页面，风格各一。下载前提是懂vue和springboot哦，不然环境都搭不好就很尴尬啦~
关于动漫的HTML网页设计
06-09
关于动漫视频网站的HTML，页面设计，采用HTML+CSS制作
HTML5期末大作业：动漫人物介绍网站设计——哆啦A梦(5页) HTML+CSS+JavaScript 学生动漫网页设计模板下载 哆啦A大学生HTML网页制作作品 简单漫画网页设计成品
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
11-11 8024
HTML5期末大作业：动漫人物介绍网站设计——哆啦A梦(5页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 计算机毕设网页设计源码 常见网页设计作业题材有 个人、 美食、 公司、 学校、 旅游、 电商、 宠物、 电器、 茶叶、 家居、 酒店、 舞蹈、 动漫、 明星、 服装、 体育、 化妆品、 物流、 环保、 书籍、 婚纱、 游戏、 节日、 戒烟、 电影、 摄影、 文化、 家乡、 鲜花、 礼品、 汽车、 其他 等网页设计题目, A+水平作业, 可满足
HTML静态网页成品作业(HTML+CSS)——动漫哆啦A梦网页(3个页面)
最新发布
weixin_42283461的博客
05-14 869
HTML静态网页成品作业(HTML+CSS)——动漫哆啦A梦网页(3个页面)
计算机毕设 SpringBoot+Vue垃圾分类管理系统 智能垃圾分类系统 垃圾回收分类系统Java Vue MySQL数据库 远程调试 代码讲解
BYSJLG的博客
07-24 701
计算机毕业设计 SpringBoot+Vue垃圾分类管理系统 智能垃圾分类系统 垃圾回收分类系统
HTML网页设计期末课程大作业~仿腾讯游戏官网设计与实现(HTML+CSS+JavaScript)
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
06-23 1万+
HTML期末大作业~基于HTML+CSS+JavaScript腾讯游戏官网设计与实现 关于HTML期末网页制作，大作业A+水平 ~腾讯游戏官网HTML+CSS+JavaScript实现，共有游戏首页 关于游戏 游戏介绍 品牌活动4页面! 原始HTML+CSS+JS页面设计，可以学习学习，大学网页设计作业，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品演示 文件目录 代码实现 <!DOCTYPE html> <html lang="en"> <he
制作一个简单HTML个人网页网页（HTML+CSS）
热门推荐
weixin_46153254的博客
12-04 35万+
制作一个简单的HTML个人网页
vue+springboot最佳项目实践源码
03-28
vue+springboot最佳项目实践源码
基于netty+websocket+springboot的实时聊天系统项目源码.zip
01-06
1、基于netty+websocket+springboot的实时聊天系统项目源码.zip 2、该资源包括项目的全部源码，下载可以直接使用！ 3、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，作为参考资料...
动漫网站源码动漫网站源码.rar
08-01
动漫网站源码动漫网站源码.rar
一个完整的建设动漫网站源码
04-11
很好用的一个网站源码！全站源码，支持自动更新！！！！
html+css网页设计源码(简洁)
12-25
html+css网页设计源码(简洁)，前端基础代码，拿来就用 评分: ⭐⭐⭐⭐⭐
简单的动漫网页
05-30
个人网页模板，极其精美，极其精美，极其精美
fiscobcos+springboot+vue前后端分离电商项目（简单易懂的区块链入门项目，包含区块链环境部署）
05-29
fiscobcos+springboot+vue前后端分离电商项目（简单易懂的区块链入门项目，包含区块链环境部署，前后端源码，作者联系方式，代码任何问题都可联系作者）。
vue+springboot前后端分离项目源码
10-09
vue+springboot+redis+druid+rabbitmq前后端分离项目源码
web前端课程设计——动漫网页2个网页HTML+CSS web前端开发技术 web课程设计 网页规划与设计
VX_WJ88950106的博客
01-08 538
1网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了Logo（源文件）所需的知识点。
关于动漫的HTML网页设计作业——动漫网页(刀剑神域6个页面)
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
07-06 2万+
关于动漫的HTML网页设计作业——动漫网页(刀剑神域6个页面) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品介绍 1.网页作品简介方面 ：日本动漫网页(6个页面)网站模板。喜欢的可以下载，文章页支持手机PC响应式布局。主
一个简单的HTML网页
weixin_46153254的博客
12-24 2万+
HTML前端网页，一个介绍景区的网页
vue2+elementui+springboot开源项目
11-28
Vue2 ElementUI SpringBoot 开源项目是一个基于前后端分离架构的开发项目。前端使用了Vue2框架和ElementUI组件库，实现了页面展示、交互效果和数据绑定等功能。Vue2是一款流行的JavaScript框架，具有响应式的数据绑定和组件化的开发思路，可以快速地构建现代化的Web应用。ElementUI是一套基于Vue2的UI组件库，提供了丰富的样式和组件，能够帮助开发者快速构建出美观且易于使用的界面。 而后端则采用了SpringBoot框架，SpringBoot是一个快速开发微服务的框架，它能够简化Spring项目的搭建过程，提高开发效率。SpringBoot具有自动配置、快速启动、无需配置XML等特点，能够帮助开发者快速搭建出高性能的后端服务。 整个开源项目结合了Vue2前端和SpringBoot后端，实现了前后端分离开发，能够提供更加灵活、高效的开发方式。同时，该开源项目还具有可扩展性和稳定性，能够满足各种规模的项目需求。 总的来说，Vue2 ElementUI SpringBoot 开源项目是一个结合了现代化前端开发和高性能后端服务的开源项目，具有一定的使用价值和实践意义。它不仅能够帮助开发者快速构建出优秀的Web应用，还能够为业界提供一些开发经验和技术分享。希望能够得到更多人的关注和支持，共同推动前端与后端开发的发展。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值