Day63 Web开发4 分类数据查询

  • hader.html加载后,发送ajax请求,请求category/findAll

       //查询分类数据
        $.get("category/findAll",{},function (data) {
            //[{cid:1,cname:国内游},{},{}]
            var lis = '<li class="nav-active"><a href="index.html">首页</a></li>';
            //遍历数组,拼接字符串(<li>)
            for (var i = 0; i < data.length; i++) {
                var li = '<li><a href="route_list.html?cid='+data[i].cid+'">'+data[i].cname+'</a></li>';

                lis += li;
                
            }
            

            //拼接收藏排行榜的li,<li><a href="favoriterank.html">收藏排行榜</a></li>
            
            lis+= '<li><a href="favoriterank.html">收藏排行榜</a></li>';

            //将lis字符串,设置到ul的html内容中
            $("#category").html(lis);
        });
  •  CategoryServlet
import ...

@WebServlet("/category/*")
public class CategoryServlet extends BaseServlet {

    private CategoryService service = new CategoryServiceImpl();

    /**
     * 查询所有
     * @param request
     * @param response
     * @throws ServletException
     * @throws IOException
     */
    protected void findAll(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1.调用service方法查询所有
        List<Category> cs = service.findAll();
        //2.序列化json返回
        writeValue(cs, response);
    }

}
  • CategoryService
import ...

public class CategoryServiceImpl implements CategoryService {

    private CategoryDao categoryDao = new CategoryDaoImpl();

    @Override
    public List<Category> findAll() {
        //1.从redis中查询
        //1.1获取jedis客户端
        Jedis jedis = JedisUtil.getJedis();
        //1.2可使用sortedset排序查询
        //Set<String> categorys = jedis.zrange("category", 0, -1);
        //1.3查询sortedset中的分数(cid)和值(cname)
        Set<Tuple> categorys = jedis.zrangeWithScores("category", 0, -1);

        List<Category> cs = null;
        //2.判断查询的集合是否为空
        if (categorys == null || categorys.size() == 0) {

            System.out.println("从数据库查询....");
            //3.如果为空,需要从数据库查询,在将数据存入redis
            //3.1 从数据库查询
            cs = categoryDao.findAll();
            //3.2 将集合数据存储到redis中的 category的key
            for (int i = 0; i < cs.size(); i++) {

                jedis.zadd("category", cs.get(i).getCid(), cs.get(i).getCname());
            }
        } else {
            System.out.println("从redis中查询.....");

            //4.如果不为空,将set的数据存入list
            cs = new ArrayList<Category>();
            for (Tuple tuple : categorys) {
                Category category = new Category();
                category.setCname(tuple.getElement());
                category.setCid((int)tuple.getScore());
                cs.add(category);

            }
        }


        return cs;
    }
}
  • CategoryDao
public class CategoryDaoImpl implements CategoryDao {

    private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());

    @Override
    public List<Category> findAll() {
        String sql = "select * from tab_category";
        return template.query(sql, new BeanPropertyRowMapper<Category>(Category.class));
    }
}

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要实现课程表,可以采用以下步骤: 1. 设计数据结构,用于存储课程信息,包括课程名称、时间、地点等。 2. 创建 HTML 页面,可以使用表格等元素来布局课程表。 3. 使用 CSS 样式美化页面,可以设置不同的颜色、边框、字体等样式。 4. 使用 JavaScript 代码动态渲染课程表,根据数据结构中的课程信息,将课程信息填充到 HTML 页面中。 以下是一个简单的示例代码: HTML: ```html <table> <tr> <th></th> <th>周一</th> <th>周二</th> <th>周三</th> <th>周四</th> <th>周五</th> </tr> <tr> <td>第一节</td> <td id="monday-1"></td> <td id="tuesday-1"></td> <td id="wednesday-1"></td> <td id="thursday-1"></td> <td id="friday-1"></td> </tr> <tr> <td>第二节</td> <td id="monday-2"></td> <td id="tuesday-2"></td> <td id="wednesday-2"></td> <td id="thursday-2"></td> <td id="friday-2"></td> </tr> <!-- 其他节次的行 --> </table> ``` CSS: ```css table { border-collapse: collapse; } th, td { border: 1px solid gray; padding: 10px; text-align: center; } th { background-color: lightgray; } #monday-1, #monday-2 { background-color: yellow; } #tuesday-1, #tuesday-2 { background-color: pink; } /* 其他单元格的样式 */ ``` JavaScript: ```javascript // 假设有以下数据 const courses = [ { name: '语文', day: 'monday', start: 1, end: 2, location: '教室A' }, { name: '数学', day: 'tuesday', start: 3, end: 4, location: '教室B' }, // 其他课程的数据 ]; // 遍历数据,将课程信息填充到表格中 courses.forEach(course => { for (let i = course.start; i <= course.end; i++) { const cellId = `${course.day}-${i}`; const cell = document.getElementById(cellId); cell.textContent = course.name + '\n' + course.location; } }); ``` 这样就可以实现一个简单的课程表了。当然,实际开发中还需要考虑更多的细节,比如如何处理课程时间冲突、如何支持不同周的课程表等等。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值