console
const data = [
{
"page": 1,
"part": "001.尚硅谷_HTML和CSS-引课",
"duration": 97
},
{
"page": 2,
"part": "002.尚硅谷_HTML和CSS-BS软件的结构",
"duration": 52
},
{
"page": 3,
"part": "003.尚硅谷_HTML和CSS-前端的开发流程",
"duration": 59
},
{
"page": 4,
"part": "004.尚硅谷_HTML和CSS-网页的组成部分",
"duration": 85
},
{
"page": 5,
"part": "005.尚硅谷_HTML和CSS-HTML简介",
"duration": 47
},
{
"page": 6,
"part": "006.尚硅谷_HTML和CSS-创建HTML页面",
"duration": 271
},
{
"page": 7,
"part": "007.尚硅谷_HTML和CSS-html的书写规范",
"duration": 362
},
{
"page": 8,
"part": "008.尚硅谷_HTML和CSS-HTML标签的介绍",
"duration": 431
},
{
"page": 9,
"part": "009.尚硅谷_HTML和CSS-HTML标签的语法",
"duration": 302
},
{
"page": 10,
"part": "010.尚硅谷_HTML和CSS-font标签",
"duration": 302
},
{
"page": 11,
"part": "011.尚硅谷_HTML和CSS-特殊字符",
"duration": 282
},
{
"page": 12,
"part": "012.尚硅谷_HTML和CSS-标题标签h1 - h6",
"duration": 185
},
{
"page": 13,
"part": "013.尚硅谷_HTML和CSS-超连接标签",
"duration": 267
},
{
"page": 14,
"part": "014.尚硅谷_HTML和CSS-无序列表",
"duration": 350
},
{
"page": 15,
"part": "015.尚硅谷_HTML和CSS-img标签",
"duration": 779
},
{
"page": 16,
"part": "016.尚硅谷_HTML和CSS-table标签",
"duration": 582
},
{
"page": 17,
"part": "017.尚硅谷_HTML和CSS-表格的跨行跨列",
"duration": 299
},
{
"page": 18,
"part": "018.尚硅谷_HTML和CSS-ifarme标签介绍",
"duration": 537
},
{
"page": 19,
"part": "019.尚硅谷_HTML和CSS-表单显示",
"duration": 1259
},
{
"page": 20,
"part": "020.尚硅谷_HTML和CSS-表单格式化",
"duration": 329
},
{
"page": 21,
"part": "021.尚硅谷_HTML和CSS-表单提交的细节",
"duration": 1105
},
{
"page": 22,
"part": "022.尚硅谷_HTML和CSS-其他标签div、span、p",
"duration": 216
},
{
"page": 23,
"part": "023.尚硅谷_HTML和CSS-CSS介绍",
"duration": 80
},
{
"page": 24,
"part": "024.尚硅谷_HTML和CSS-CSS语法介绍",
"duration": 144
},
{
"page": 25,
"part": "025.尚硅谷_HTML和CSS-CSS与HTML结合使用的第一种方式",
"duration": 341
},
{
"page": 26,
"part": "026.尚硅谷_HTML和CSS-CSS与HTML结合使用的第二种方式",
"duration": 299
},
{
"page": 27,
"part": "027.尚硅谷_HTML和CSS-CSS与HTML结合使用的第三种方式",
"duration": 202
},
{
"page": 28,
"part": "028.尚硅谷_HTML和CSS-标签名选择器",
"duration": 379
},
{
"page": 29,
"part": "029.尚硅谷_HTML和CSS-id选择器",
"duration": 277
},
{
"page": 30,
"part": "030.尚硅谷_HTML和CSS-class类型选择器",
"duration": 233
},
{
"page": 31,
"part": "031.尚硅谷_HTML和CSS-组合选择器",
"duration": 179
},
{
"page": 32,
"part": "032.尚硅谷_HTML和CSS-css常用样式",
"duration": 414
},
{
"page": 33,
"part": "033.尚硅谷_JavaScript-JavaScript介绍",
"duration": 265
},
{
"page": 34,
"part": "034.尚硅谷_JavaScript-JavaScript与HTML结合使用的第一种方式",
"duration": 124
},
{
"page": 35,
"part": "035.尚硅谷_JavaScript-JavaScript与HTML结合使用的第二种方式",
"duration": 225
},
{
"page": 36,
"part": "036.尚硅谷_JavaScript-JavaScript的变量和数据类型介绍",
"duration": 381
},
{
"page": 37,
"part": "037.尚硅谷_JavaScript-JavaScript的关系运算",
"duration": 147
},
{
"page": 38,
"part": "038.尚硅谷_JavaScript-JavaScript的逻辑运算",
"duration": 595
},
{
"page": 39,
"part": "039.尚硅谷_JavaScript-JavaScript的数组",
"duration": 497
},
{
"page": 40,
"part": "040.尚硅谷_JavaScript-函数的第一种定义方式",
"duration": 335
},
{
"page": 41,
"part": "041.尚硅谷_JavaScript-函数的第二种定义方式",
"duration": 175
},
{
"page": 42,
"part": "042.尚硅谷_JavaScript-js中的函数不允许重载",
"duration": 129
},
{
"page": 43,
"part": "043.尚硅谷_JavaScript-隐形参数arguments",
"duration": 515
},
{
"page": 44,
"part": "044.尚硅谷_JavaScript-Object形式的自定义对象",
"duration": 258
},
{
"page": 45,
"part": "045.尚硅谷_JavaScript-花括号形式的自定义对象",
"duration": 246
},
{
"page": 46,
"part": "046.尚硅谷_JavaScript-事件介绍",
"duration": 156
},
{
"page": 47,
"part": "047.尚硅谷_JavaScript-两种事件注册的介绍",
"duration": 174
},
{
"page": 48,
"part": "048.尚硅谷_JavaScript-onload事件",
"duration": 271
},
{
"page": 49,
"part": "049.尚硅谷_JavaScript-onclick事件",
"duration": 330
},
{
"page": 50,
"part": "050.尚硅谷_JavaScript-onblur事件",
"duration": 377
},
{
"page": 51,
"part": "051.尚硅谷_JavaScript-onchange事件",
"duration": 296
},
{
"page": 52,
"part": "052.尚硅谷_JavaScript-onsubmit事件",
"duration": 411
},
{
"page": 53,
"part": "053.尚硅谷_JavaScript-document对象概念介绍",
"duration": 457
},
{
"page": 54,
"part": "054.尚硅谷_JavaScript-验证用户名是否有效",
"duration": 761
},
{
"page": 55,
"part": "055.尚硅谷_JavaScript-正则表达式对象",
"duration": 1397
},
{
"page": 56,
"part": "056.尚硅谷_JavaScript-两种常见的验证提示效果",
"duration": 380
},
{
"page": 57,
"part": "057.尚硅谷_JavaScript-getElementsByName方法",
"duration": 729
},
{
"page": 58,
"part": "058.尚硅谷_JavaScript-getElementsByTagName方法",
"duration": 260
},
{
"page": 59,
"part": "059.尚硅谷_JavaScript-document对象三个查询方法的使用注意事项",
"duration": 340
},
{
"page": 60,
"part": "060.尚硅谷_JavaScript-dom对象查询练习",
"duration": 1249
},
{
"page": 61,
"part": "061.尚硅谷_JavaScript-document对象补充说明",
"duration": 485
},
{
"page": 62,
"part": "062.尚硅谷_jQuery-jQuery介绍",
"duration": 106
},
{
"page": 63,
"part": "063.尚硅谷_jQuery-jQuery的Hello程序示例",
"duration": 448
},
{
"page": 64,
"part": "064.尚硅谷_jQuery-jQuery的Hello程序常见问题",
"duration": 217
},
{
"page": 65,
"part": "065.尚硅谷_jQuery-jQuery的函数核心介绍",
"duration": 521
},
{
"page": 66,
"part": "066.尚硅谷_jQuery-如何区分DOM对象和jQuery对象",
"duration": 189
},
{
"page": 67,
"part": "067.尚硅谷_jQuery-jQuery对象的本质",
"duration": 261
},
{
"page": 68,
"part": "068.尚硅谷_jQuery-jQuery对象和DOM对象使用上的区别",
"duration": 195
},
{
"page": 69,
"part": "069.尚硅谷_jQuery-jQuery对象和DOM对象的相互转换",
"duration": 120
},
{
"page": 70,
"part": "070.尚硅谷_jQuery-基础选择器",
"duration": 858
},
{
"page": 71,
"part": "071.尚硅谷_jQuery-层级选择器",
"duration": 400
},
{
"page": 72,
"part": "072.尚硅谷_jQuery-基本过滤选择器",
"duration": 734
},
{
"page": 73,
"part": "073.尚硅谷_jQuery-内容过滤选择器",
"duration": 384
},
{
"page": 74,
"part": "074.尚硅谷_jQuery-属性过滤选择器",
"duration": 710
},
{
"page": 75,
"part": "075.尚硅谷_jQuery-表单过滤选择器",
"duration": 1285
},
{
"page": 76,
"part": "076.尚硅谷_jQuery-元素的筛选",
"duration": 1782
},
{
"page": 77,
"part": "077.尚硅谷_jQuery-html()、text()、val()方法",
"duration": 1059
},
{
"page": 78,
"part": "078.尚硅谷_jQuery-attr() 和 prop() 方法",
"duration": 592
},
{
"page": 79,
"part": "079.尚硅谷_jQuery-练习：全选、全不选、反选",
"duration": 1001
},
{
"page": 80,
"part": "080.尚硅谷_jQuery-dom的增，删，改",
"duration": 577
},
{
"page": 81,
"part": "081.尚硅谷_jQuery-练习：从左到右，从右到左",
"duration": 366
},
{
"page": 82,
"part": "082.尚硅谷_jQuery-练习：动态添加和删除行记录",
"duration": 1606
},
{
"page": 83,
"part": "083.尚硅谷_jQuery-css样式操作",
"duration": 633
},
{
"page": 84,
"part": "084.尚硅谷_jQuery-动画操作",
"duration": 769
},
{
"page": 85,
"part": "085.尚硅谷_jQuery-练习：品牌展示",
"duration": 1320
},
{
"page": 86,
"part": "086.尚硅谷_jQuery-原生js和jQuery页面加载完成之后的区别",
"duration": 646
},
{
"page": 87,
"part": "087.尚硅谷_jQuery-jQuery中常用的事件处理方法",
"duration": 895
},
{
"page": 88,
"part": "088.尚硅谷_jQuery-事件的冒泡",
"duration": 178
},
{
"page": 89,
"part": "089.尚硅谷_jQuery-事件对象",
"duration": 404
},
{
"page": 90,
"part": "090.尚硅谷_jQuery-练习：图片跟随",
"duration": 422
},
{
"page": 91,
"part": "091.尚硅谷_书城项目-第一阶段：表单验证的说明",
"duration": 73
},
{
"page": 92,
"part": "092.尚硅谷_书城项目-第一阶段：表单验证的实现",
"duration": 1284
},
{
"page": 93,
"part": "093.尚硅谷_xml-什么是XML以及它的作用",
"duration": 261
},
{
"page": 94,
"part": "094.尚硅谷_xml-第一个xml示例文件",
"duration": 401
},
{
"page": 95,
"part": "095.尚硅谷_xml-xml语法介绍",
"duration": 785
},
{
"page": 96,
"part": "096.尚硅谷_xml-xml解析技术介绍",
"duration": 339
},
{
"page": 97,
"part": "097.尚硅谷_xml-使用dom4j读取xml文件得到Document对象",
"duration": 556
},
{
"page": 98,
"part": "098.尚硅谷_xml-使用dom4j解析xml",
"duration": 618
},
{
"page": 99,
"part": "099.尚硅谷_Tomcat-JavaWeb概念",
"duration": 205
},
{
"page": 100,
"part": "100.尚硅谷_Tomcat-Web资源的分类",
"duration": 88
},
{
"page": 101,
"part": "101.尚硅谷_Tomcat-常见Web服务器",
"duration": 130
},
{
"page": 102,
"part": "102.尚硅谷_Tomcat-Tomcat服务器和Servlet版本的对应关系",
"duration": 148
},
{
"page": 103,
"part": "103.尚硅谷_Tomcat-Tomcat服务器的安装",
"duration": 103
},
{
"page": 104,
"part": "104.尚硅谷_Tomcat-Tomcat目录的介绍",
"duration": 247
},
{
"page": 105,
"part": "105.尚硅谷_Tomcat-如何启动Tomcat服务器",
"duration": 200
},
{
"page": 106,
"part": "106.尚硅谷_Tomcat-常见Tomcat启动失败的原因",
"duration": 266
},
{
"page": 107,
"part": "107.尚硅谷_Tomcat-JAVA_HOME配置失败的几种常见情况",
"duration": 111
},
{
"page": 108,
"part": "108.尚硅谷_Tomcat-另一种启动Tomcat服务器的方式catalina run",
"duration": 167
},
{
"page": 109,
"part": "109.尚硅谷_Tomcat-停止Tomcat服务器的几种方式",
"duration": 136
},
{
"page": 110,
"part": "110.尚硅谷_Tomcat-修改Tomcat默认端口号",
"duration": 321
},
{
"page": 111,
"part": "111.尚硅谷_Tomcat-第一种部署web工程的方式",
"duration": 301
},
{
"page": 112,
"part": "112.尚硅谷_Tomcat-第二种部署web工程的方式",
"duration": 334
},
{
"page": 113,
"part": "113.尚硅谷_Tomcat-手托html页面和在浏览器中输入地址访问的背后不同原因",
"duration": 419
},
{
"page": 114,
"part": "114.尚硅谷_Tomcat-默认访问的工程和默认访问的资源",
"duration": 259
},
{
"page": 115,
"part": "115.尚硅谷_Tomcat-IDEA整合Tomcat服务器",
"duration": 215
},
{
"page": 116,
"part": "116.尚硅谷_Tomcat-如何创建动态的web工程",
"duration": 228
},
{
"page": 117,
"part": "117.尚硅谷_Tomcat-动态web工程目录的介绍",
"duration": 305
},
{
"page": 118,
"part": "118.尚硅谷_Tomcat-给Tomcat添加第三方jar包",
"duration": 462
},
{
"page": 119,
"part": "119.尚硅谷_Tomcat-如何在IDEA中启动部署web模板",
"duration": 795
},
{
"page": 120,
"part": "120.尚硅谷_Tomcat-Tomcat实例使用的其他细节说明",
"duration": 394
},
{
"page": 121,
"part": "121.尚硅谷_Servlet-什么是Servlet",
"duration": 142
},
{
"page": 122,
"part": "122.尚硅谷_Servlet-第一个Servlet程序",
"duration": 637
},
{
"page": 123,
"part": "123.尚硅谷_Servlet-Servlet程序常见错误",
"duration": 390
},
{
"page": 124,
"part": "124.尚硅谷_Servlet-url地址如何定位到Servlet程序去访问",
"duration": 476
},
{
"page": 125,
"part": "125.尚硅谷_Servlet-Servlet生命周期方法",
"duration": 255
},
{
"page": 126,
"part": "126.尚硅谷_Servlet-请求的分发处理",
"duration": 639
},
{
"page": 127,
"part": "127.尚硅谷_Servlet-通过继承HttpServlet类实现Servlet程序",
"duration": 331
},
{
"page": 128,
"part": "128.尚硅谷_Servlet-IDEA菜单生成Servlet程序",
"duration": 298
},
{
"page": 129,
"part": "129.尚硅谷_Servlet-整个Servlet类的继承体系",
"duration": 819
},
{
"page": 130,
"part": "130.尚硅谷_Servlet-ServletConfig类使用介绍",
"duration": 419
},
{
"page": 131,
"part": "131.尚硅谷_Servlet-ServletConfig类的补充说明",
"duration": 524
},
{
"page": 132,
"part": "132.尚硅谷_Servlet-ServletContext对象的介绍",
"duration": 193
},
{
"page": 133,
"part": "133.尚硅谷_Servlet-ServletContext对象作用的演示",
"duration": 1153
},
{
"page": 134,
"part": "134.尚硅谷_Servlet-ServletContext像map一样存取数据",
"duration": 673
},
{
"page": 135,
"part": "135.尚硅谷_Servlet-什么是HTTP协议",
"duration": 93
},
{
"page": 136,
"part": "136.尚硅谷_Servlet-GET请求HTTP协议内容介绍",
"duration": 717
},
{
"page": 137,
"part": "137.尚硅谷_Servlet-POST请求HTTP协议内容介绍",
"duration": 638
},
{
"page": 138,
"part": "138.尚硅谷_Servlet-常用请求头",
"duration": 62
},
{
"page": 139,
"part": "139.尚硅谷_Servlet-哪些是GET请求，哪些是POST请求",
"duration": 133
},
{
"page": 140,
"part": "140.尚硅谷_Servlet-响应的HTTP协议介绍",
"duration": 395
},
{
"page": 141,
"part": "141.尚硅谷_Servlet-常见的响应状态码说明",
"duration": 169
},
{
"page": 142,
"part": "142.尚硅谷_Servlet-MIME数据类型",
"duration": 174
},
{
"page": 143,
"part": "143.尚硅谷_Servlet-谷歌浏览器和火狐浏览器如何查看HTTP协议",
"duration": 353
},
{
"page": 144,
"part": "144.尚硅谷_Servlet-HttpServletRequest类的介绍",
"duration": 108
},
{
"page": 145,
"part": "145.尚硅谷_Servlet-Request常用API的演示",
"duration": 670
},
{
"page": 146,
"part": "146.尚硅谷_Servlet-获取请求的参数值---补充",
"duration": 459
},
{
"page": 147,
"part": "147.尚硅谷_Servlet-获取请求的参数值",
"duration": 171
},
{
"page": 148,
"part": "148.尚硅谷_Servlet-解决post请求中文乱码问题",
"duration": 201
},
{
"page": 149,
"part": "149.尚硅谷_Servlet-请求转发",
"duration": 1268
},
{
"page": 150,
"part": "150.尚硅谷_Servlet-base标签的作用",
"duration": 956
},
{
"page": 151,
"part": "151.尚硅谷_Servlet-回顾javaweb中的路径",
"duration": 75
},
{
"page": 152,
"part": "152.尚硅谷_Servlet-斜杠在web中的不同意义",
"duration": 251
},
{
"page": 153,
"part": "153.尚硅谷_Servlet-HttpServletResponse类的介绍",
"duration": 85
},
{
"page": 154,
"part": "154.尚硅谷_Servlet-两个响应流的介绍",
"duration": 255
},
{
"page": 155,
"part": "155.尚硅谷_Servlet-给客户端回传字符串数据",
"duration": 71
},
{
"page": 156,
"part": "156.尚硅谷_Servlet-解决响应的中文乱码",
"duration": 292
},
{
"page": 157,
"part": "157.尚硅谷_Servlet-解决响应中文乱码方案二",
"duration": 137
},
{
"page": 158,
"part": "158.尚硅谷_Servlet-请求重定向",
"duration": 1005
},
{
"page": 159,
"part": "159.尚硅谷_Servlet-请求重定向第二种实现方案",
"duration": 82
},
{
"page": 160,
"part": "160.尚硅谷_书城项目-第二阶段：用户登录和注册功能的介绍",
"duration": 91
},
{
"page": 161,
"part": "161.尚硅谷_书城项目-JavaEE三层架构介绍",
"duration": 579
},
{
"page": 162,
"part": "162.尚硅谷_书城项目-搭建书城项目环境",
"duration": 319
},
{
"page": 163,
"part": "163.尚硅谷_书城项目-创建数据库和t_user用户表",
"duration": 355
},
{
"page": 164,
"part": "164.尚硅谷_书城项目-创建数据库表对应的User类",
"duration": 96
},
{
"page": 165,
"part": "165.尚硅谷_书城项目-JdbcUtils工具类的编写和测试",
"duration": 838
},
{
"page": 166,
"part": "166.尚硅谷_书城项目-编写BaseDao",
"duration": 685
},
{
"page": 167,
"part": "167.尚硅谷_书城项目-编写UserDao和测试",
"duration": 768
},
{
"page": 168,
"part": "168.尚硅谷_书城项目-编写UserService和测试",
"duration": 524
},
{
"page": 169,
"part": "169.尚硅谷_书城项目-实现用户注册的功能",
"duration": 1349
},
{
"page": 170,
"part": "170.尚硅谷_书城项目-IDEA工具Debug的使用",
"duration": 1341
},
{
"page": 171,
"part": "171.尚硅谷_书城项目-用户登录功能实现",
"duration": 802
},
{
"page": 172,
"part": "172.尚硅谷_jsp-什么是jsp，以及它有什么作用",
"duration": 519
},
{
"page": 173,
"part": "173.尚硅谷_jsp-jsp的小结",
"duration": 215
},
{
"page": 174,
"part": "174.尚硅谷_jsp-jsp页面的本质",
"duration": 532
},
{
"page": 175,
"part": "175.尚硅谷_jsp-jsp的page指令",
"duration": 986
},
{
"page": 176,
"part": "176.尚硅谷_jsp-声明脚本",
"duration": 444
},
{
"page": 177,
"part": "177.尚硅谷_jsp-表达式脚本",
"duration": 468
},
{
"page": 178,
"part": "178.尚硅谷_jsp-代码脚本",
"duration": 867
},
{
"page": 179,
"part": "179.尚硅谷_jsp-jsp中的三种注释",
"duration": 247
},
{
"page": 180,
"part": "180.尚硅谷_jsp-jsp中的九大内置对象",
"duration": 217
},
{
"page": 181,
"part": "181.尚硅谷_jsp-四个域对象的演示",
"duration": 732
},
{
"page": 182,
"part": "182.尚硅谷_jsp-out和response输出的区别",
"duration": 1197
},
{
"page": 183,
"part": "183.尚硅谷_jsp-常用标签 之 静态包含",
"duration": 535
},
{
"page": 184,
"part": "184.尚硅谷_jsp-常用标签 之 动态包含",
"duration": 662
},
{
"page": 185,
"part": "185.尚硅谷_jsp-常用标签 之 请求转发",
"duration": 119
},
{
"page": 186,
"part": "186.尚硅谷_jsp-练习一：九九乘法口诀表",
"duration": 459
},
{
"page": 187,
"part": "187.尚硅谷_jsp-练习二：遍历输出10个学生信息到表格中",
"duration": 482
},
{
"page": 188,
"part": "188.尚硅谷_jsp-请求转发的使用说明",
"duration": 618
},
{
"page": 189,
"part": "189.尚硅谷_jsp-什么是Listener监听器",
"duration": 151
},
{
"page": 190,
"part": "190.尚硅谷_jsp-ServletContextListener监听器演示",
"duration": 347
},
{
"page": 191,
"part": "191.尚硅谷_EL表达式-什么是EL表达式，以及它的作用",
"duration": 394
},
{
"page": 192,
"part": "192.尚硅谷_EL表达式-EL表达式搜索四个域的顺序",
"duration": 325
},
{
"page": 193,
"part": "193.尚硅谷_EL表达式-EL表达式输出复杂的Bean对象",
"duration": 899
},
{
"page": 194,
"part": "194.尚硅谷_EL表达式-关系运算",
"duration": 179
},
{
"page": 195,
"part": "195.尚硅谷_EL表达式-逻辑运算",
"duration": 119
},
{
"page": 196,
"part": "196.尚硅谷_EL表达式-算术运算",
"duration": 137
},
{
"page": 197,
"part": "197.尚硅谷_EL表达式-empty运算",
"duration": 371
},
{
"page": 198,
"part": "198.尚硅谷_EL表达式-点运算和中括号运算",
"duration": 485
},
{
"page": 199,
"part": "199.尚硅谷_EL表达式-11个EL隐含对象的介绍",
"duration": 350
},
{
"page": 200,
"part": "200.尚硅谷_EL表达式-pageScope、requestScope、sessionScope、applicationScope的示例",
"duration": 285
},
{
"page": 201,
"part": "201.尚硅谷_EL表达式-pageContext演示",
"duration": 603
},
{
"page": 202,
"part": "202.尚硅谷_EL表达式-其他EL隐含对象的示例",
"duration": 1029
},
{
"page": 203,
"part": "203.尚硅谷_JSTL标签库-JSTL标签库的介绍",
"duration": 188
},
{
"page": 204,
"part": "204.尚硅谷_JSTL标签库-标签库的使用步骤",
"duration": 205
},
{
"page": 205,
"part": "205.尚硅谷_JSTL标签库-set标签",
"duration": 321
},
{
"page": 206,
"part": "206.尚硅谷_JSTL标签库-if标签",
"duration": 158
},
{
"page": 207,
"part": "207.尚硅谷_JSTL标签库-choose、when、otherwise标签",
"duration": 553
},
{
"page": 208,
"part": "208.尚硅谷_JSTL标签库-使用forEach遍历1到10的情况",
"duration": 326
},
{
"page": 209,
"part": "209.尚硅谷_JSTL标签库-使用forEach遍历Object数组",
"duration": 214
},
{
"page": 210,
"part": "210.尚硅谷_JSTL标签库-使用forEach遍历Map集合",
"duration": 271
},
{
"page": 211,
"part": "211.尚硅谷_JSTL标签库-使用forEach遍历List集合",
"duration": 490
},
{
"page": 212,
"part": "212.尚硅谷_JSTL标签库-forEach标签所有属性组合使用介绍",
"duration": 881
},
{
"page": 213,
"part": "213.尚硅谷_文件上传-文件上传的介绍",
"duration": 488
},
{
"page": 214,
"part": "214.尚硅谷_文件上传-上传的http协议内容介绍",
"duration": 820
},
{
"page": 215,
"part": "215.尚硅谷_文件上传-上传合用到的类和方法的介绍",
"duration": 376
},
{
"page": 216,
"part": "216.尚硅谷_文件上传-使用fileupload解析上传的数据",
"duration": 452
},
{
"page": 217,
"part": "217.尚硅谷_文件下载-文件下载的实现",
"duration": 907
},
{
"page": 218,
"part": "218.尚硅谷_文件下载-使用URLEncoder解决谷歌和IE浏览器中文下载名乱码问题",
"duration": 285
},
{
"page": 219,
"part": "219.尚硅谷_文件下载-Base64编解码操作",
"duration": 350
},
{
"page": 220,
"part": "220.尚硅谷_文件下载-使用Base64编解码解决火狐浏览器附件中文乱码问题",
"duration": 202
},
{
"page": 221,
"part": "221.尚硅谷_文件下载-使用User-Agent请求头判断，动态切换不同的方案解决所有浏览器附件中文乱码问题",
"duration": 248
},
{
"page": 222,
"part": "222.尚硅谷_书城项目-第三阶段：修改所有html页面为jsp页面",
"duration": 809
},
{
"page": 223,
"part": "223.尚硅谷_书城项目-第三阶段：抽取所有jsp页面中公共内容",
"duration": 797
},
{
"page": 224,
"part": "224.尚硅谷_书城项目-动态的base标签值",
"duration": 310
},
{
"page": 225,
"part": "225.尚硅谷_书城项目-表单提交失败的错误回显",
"duration": 802
},
{
"page": 226,
"part": "226.尚硅谷_书城项目-代码优化：合并LoginServlet和RegistServlet程序为UserServlet程序",
"duration": 863
},
{
"page": 227,
"part": "227.尚硅谷_书城项目-代码优化二：使用反射优化大量else if代码",
"duration": 853
},
{
"page": 228,
"part": "228.尚硅谷_书城项目-代码优化三：抽取BaseServlet程序",
"duration": 347
},
{
"page": 229,
"part": "229.尚硅谷_书城项目-BeanUtils工具类的使用",
"duration": 1505
},
{
"page": 230,
"part": "230.尚硅谷_书城项目-书城项目第四阶段，使用EL表达式实现表单错误回显",
"duration": 243
},
{
"page": 231,
"part": "231.尚硅谷_书城项目-第五阶段：内容介绍",
"duration": 117
},
{
"page": 232,
"part": "232.尚硅谷_书城项目-MVC概念的介绍",
"duration": 215
},
{
"page": 233,
"part": "233.尚硅谷_书城项目-创建图书模块的数据库表",
"duration": 298
},
{
"page": 234,
"part": "234.尚硅谷_书城项目-编写图书模块的JavaBean类Book",
"duration": 230
},
{
"page": 235,
"part": "235.尚硅谷_书城项目-编写图书模块的Dao和测试",
"duration": 722
},
{
"page": 236,
"part": "236.尚硅谷_书城项目-编写图书模块的Service和测试",
"duration": 441
},
{
"page": 237,
"part": "237.尚硅谷_书城项目-图书列表功能的实现",
"duration": 1049
},
{
"page": 238,
"part": "238.尚硅谷_书城项目-前后台的简单介绍",
"duration": 266
},
{
"page": 239,
"part": "239.尚硅谷_书城项目-添加图书功能实现",
"duration": 876
},
{
"page": 240,
"part": "240.尚硅谷_书城项目-删除图书功能的实现",
"duration": 1153
},
{
"page": 241,
"part": "241.尚硅谷_书城项目-修改图书第一步，回显修改的信息",
"duration": 850
},
{
"page": 242,
"part": "242.尚硅谷_书城项目-修改图书第二步，提交给服务器保存修改",
"duration": 1163
},
{
"page": 243,
"part": "243.尚硅谷_书城项目-第五阶段：图书分页的分析",
"duration": 1514
},
{
"page": 244,
"part": "244.尚硅谷_书城项目-分页模型Page对象的创建",
"duration": 270
},
{
"page": 245,
"part": "245.尚硅谷_书城项目-分页初步实现",
"duration": 1374
},
{
"page": 246,
"part": "246.尚硅谷_书城项目-首页、上一页、下一页、末页的实现",
"duration": 407
},
{
"page": 247,
"part": "247.尚硅谷_书城项目-跳到指定页码功能的实现",
"duration": 334
},
{
"page": 248,
"part": "248.尚硅谷_书城项目-数据有效边境检查",
"duration": 442
},
{
"page": 249,
"part": "249.尚硅谷_书城项目-分页条页码的输出",
"duration": 1233
},
{
"page": 250,
"part": "250.尚硅谷_书城项目-修改分页对原来，添加、删除、修改的影响",
"duration": 664
},
{
"page": 251,
"part": "251.尚硅谷_书城项目-前台分页的初步实现",
"duration": 1263
},
{
"page": 252,
"part": "252.尚硅谷_书城项目-分页条的抽取",
"duration": 500
},
{
"page": 253,
"part": "253.尚硅谷_书城项目-价格区间搜索并分页的分析",
"duration": 521
},
{
"page": 254,
"part": "254.尚硅谷_书城项目-价格区间搜索并分页功能的实现",
"duration": 845
},
{
"page": 255,
"part": "255.尚硅谷_书城项目-搜索价格区间的回显",
"duration": 86
},
{
"page": 256,
"part": "256.尚硅谷_书城项目-解决分页条中不带价格区间的bug",
"duration": 326
},
{
"page": 257,
"part": "257.尚硅谷_Cookie-什么是Cookie",
"duration": 125
},
{
"page": 258,
"part": "258.尚硅谷_Cookie-Cookie的创建",
"duration": 1010
},
{
"page": 259,
"part": "259.尚硅谷_Cookie-Cookie的获取",
"duration": 898
},
{
"page": 260,
"part": "260.尚硅谷_Cookie-Cookie值的修改",
"duration": 527
},
{
"page": 261,
"part": "261.尚硅谷_Cookie-谷歌和火狐浏览器如何查看Cookie",
"duration": 216
},
{
"page": 262,
"part": "262.尚硅谷_Cookie-Cookie的存活设置",
"duration": 841
},
{
"page": 263,
"part": "263.尚硅谷_Cookie-Cookie的path属性",
"duration": 474
},
{
"page": 264,
"part": "264.尚硅谷_Cookie-Cookie练习之免用户名登录",
"duration": 975
},
{
"page": 265,
"part": "265.尚硅谷_Session-什么是Session",
"duration": 133
},
{
"page": 266,
"part": "266.尚硅谷_Session-Session的创建和获取",
"duration": 626
},
{
"page": 267,
"part": "267.尚硅谷_Session-Session域中数据的存取",
"duration": 260
},
{
"page": 268,
"part": "268.尚硅谷_Session-Session超时的控制",
"duration": 1352
},
{
"page": 269,
"part": "269.尚硅谷_Session-浏览器和Session之间关联的技术内幕",
"duration": 1074
},
{
"page": 270,
"part": "270.尚硅谷_书城项目-显示登录的用户信息",
"duration": 589
},
{
"page": 271,
"part": "271.尚硅谷_书城项目-注销登录",
"duration": 204
},
{
"page": 272,
"part": "272.尚硅谷_书城项目-表单重复提交的三种常见情况",
"duration": 797
},
{
"page": 273,
"part": "273.尚硅谷_书城项目-验证码底层原理",
"duration": 380
},
{
"page": 274,
"part": "274.尚硅谷_书城项目-谷歌验证码的使用",
"duration": 718
},
{
"page": 275,
"part": "275.尚硅谷_书城项目-把谷歌验证码加入到书城中使用",
"duration": 369
},
{
"page": 276,
"part": "276.尚硅谷_书城项目-验证码的切换",
"duration": 669
},
{
"page": 277,
"part": "277.尚硅谷_书城项目-购物车模块的分析",
"duration": 846
},
{
"page": 278,
"part": "278.尚硅谷_书城项目-购物车模型的创建",
"duration": 189
},
{
"page": 279,
"part": "279.尚硅谷_书城项目-购物车功能方法的实现和测试",
"duration": 1266
},
{
"page": 280,
"part": "280.尚硅谷_书城项目-添加商品到购物车功能的实现",
"duration": 2004
},
{
"page": 281,
"part": "281.尚硅谷_书城项目-购物车的展示",
"duration": 613
},
{
"page": 282,
"part": "282.尚硅谷_书城项目-删除购物车中的商品项",
"duration": 572
},
{
"page": 283,
"part": "283.尚硅谷_书城项目-清空购物车的实现",
"duration": 299
},
{
"page": 284,
"part": "284.尚硅谷_书城项目-修改购物车商品数量",
"duration": 981
},
{
"page": 285,
"part": "285.尚硅谷_书城项目-首页购物车数据展示",
"duration": 363
},
{
"page": 286,
"part": "286.尚硅谷_书城项目-订单模块的分析",
"duration": 1145
},
{
"page": 287,
"part": "287.尚硅谷_书城项目-创建订单模型的数据库表",
"duration": 290
},
{
"page": 288,
"part": "288.尚硅谷_书城项目-编写订单模块的两个数据模型Order和OrderItem",
"duration": 224
},
{
"page": 289,
"part": "289.尚硅谷_书城项目-编写订单模块的Dao和测试",
"duration": 617
},
{
"page": 290,
"part": "290.尚硅谷_书城项目-编写订单模块的Service和测试",
"duration": 620
},
{
"page": 291,
"part": "291.尚硅谷_书城项目-结账功能实现，生成订单",
"duration": 610
},
{
"page": 292,
"part": "292.尚硅谷_书城项目-解决生成订单的bug",
"duration": 331
},
{
"page": 293,
"part": "293.尚硅谷_Filter-什么是Filter过滤器",
"duration": 126
},
{
"page": 294,
"part": "294.尚硅谷_Filter-Filter过滤器的基本使用示例",
"duration": 1342
},
{
"page": 295,
"part": "295.尚硅谷_Filter-完整的用户登录和权限检查",
"duration": 661
},
{
"page": 296,
"part": "296.尚硅谷_Filter-Filter的生命周期",
"duration": 276
},
{
"page": 297,
"part": "297.尚硅谷_Filter-FilterConfig类介绍",
"duration": 338
},
{
"page": 298,
"part": "298.尚硅谷_Filter-FilterChain多个过滤器执行的细节",
"duration": 1300
},
{
"page": 299,
"part": "299.尚硅谷_Filter-Filter拦截路径的三种配置方式",
"duration": 376
},
{
"page": 300,
"part": "300.尚硅谷_书城项目-使用Filter过滤器实现后台的权限管理",
"duration": 427
},
{
"page": 301,
"part": "301.尚硅谷_书城项目-ThreadLocal使用介绍",
"duration": 1486
},
{
"page": 302,
"part": "302.尚硅谷_书城项目-使用ThreadLocal确保所有操作都使用同一个Connection来实现事务管理",
"duration": 1831
},
{
"page": 303,
"part": "303.尚硅谷_书城项目-使用Filter统一给所有Service方法都加上try-catch来管理事务",
"duration": 1088
},
{
"page": 304,
"part": "304.尚硅谷_书城项目-使用Tomcat统一管理异常，展示友好的错误页面",
"duration": 651
},
{
"page": 305,
"part": "305.尚硅谷_JSON-什么是JSON",
"duration": 164
},
{
"page": 306,
"part": "306.尚硅谷_JSON-JSON的定义和访问",
"duration": 1057
},
{
"page": 307,
"part": "307.尚硅谷_JSON-JSON在JavaScript中两种常用的转换方法",
"duration": 385
},
{
"page": 308,
"part": "308.尚硅谷_JSON-JavaBean和json的相互转换",
"duration": 552
},
{
"page": 309,
"part": "309.尚硅谷_JSON-List集合和json的相互转换",
"duration": 465
},
{
"page": 310,
"part": "310.尚硅谷_JSON-Map集合和json的相互转换",
"duration": 420
},
{
"page": 311,
"part": "311.尚硅谷_AJAX-什么是AJAX请求",
"duration": 74
},
{
"page": 312,
"part": "312.尚硅谷_AJAX-原生JavaScript的AJAX请求示例",
"duration": 1053
},
{
"page": 313,
"part": "313.尚硅谷_AJAX-AJAX请求的特点说明",
"duration": 521
},
{
"page": 314,
"part": "314.尚硅谷_AJAX-jQuery的ajax方法",
"duration": 896
},
{
"page": 315,
"part": "315.尚硅谷_AJAX-jQuery的get和post方法",
"duration": 293
},
{
"page": 316,
"part": "316.尚硅谷_AJAX-jQuery的getJSON方法",
"duration": 173
},
{
"page": 317,
"part": "317.尚硅谷_AJAX-jQuery的serialize方法",
"duration": 447
},
{
"page": 318,
"part": "318.尚硅谷_书城项目-使用AJAX请求验证用户名是否可用",
"duration": 780
},
{
"page": 319,
"part": "319.尚硅谷_书城项目-使用AJAX请求修改添加商品到购物车的实现",
"duration": 890
},
{
"page": 320,
"part": "320.尚硅谷_i18n-什么是i18n国际化",
"duration": 156
},
{
"page": 321,
"part": "321.尚硅谷_i18n-i18n国际化三要素介绍",
"duration": 461
},
{
"page": 322,
"part": "322.尚硅谷_i18n-i18n国际化基础示例",
"duration": 581
},
{
"page": 323,
"part": "323.尚硅谷_i18n-通过请求头实现国际化",
"duration": 612
},
{
"page": 324,
"part": "324.尚硅谷_i18n-通过语言类型选择实现国际化",
"duration": 242
},
{
"page": 325,
"part": "325.尚硅谷_i18n-使用JSTL标签库fmt实现国际化",
"duration": 486
}
];
// 页面加载完成后
$(() => {
// 为submit按钮绑定点击事件
$('#submit').click(() => {
/**
* 验证开始和结束集数是否满足要求，必须是整数，且长度为1位到4位
* 1. 获取输入框里的内容
* 2. 创建正则表达式对象
* 3. 使用 test() 验证
* 4. 提示用户结果
*/
if (!check(0, '#start', '开始集数输入有误')) {
return false;
}
if (!check(0, '#end', '结束集数输入有误')) {
return false;
}
/**
* 验证平均播放倍速是否满足要求，必须是数字（含小数），且总长度为2位（含小数部分）
* 1. 获取输入框里的内容
* 2. 创建正则表达式对象
* 3. 使用 test() 验证
* 4. 提示用户结果
*/
if (!check(1, '#speed', '播放倍速输入有误')) {
return false;
}
// 恢复错误提示信息为空
$('.errMsg').text('');
});
});
function check(type, node, errMsg) {
switch(type) {
case 0:
return checkReg(node, errMsg, /^\d{1,4}$/);
break;
case 1:
return checkReg(node, errMsg, /^[0-9]+([.]{1}[0-9])?$/);
break;
// 没有default
}
}
function checkReg(node, errMsg, reg) {
const value = $(node).val();
if (!reg.test(value)) {
$('.errMsg').text(errMsg);
return false;
}
return true;
}
<html>
<body>
<div class="flex-center container">
<input id="start" class="input" placeholder="请输入开始集数" value=""/>
<input id="end" class="input" placeholder="请输入结束集数" />
<input id="speed" class="input" placeholder="请输入平均播放倍速" value=""/>
<div class="flex-center_column">
<div class="errMsg"></div>
<button id="submit" class="btn">确认(Enter)</button>
</div>
<div class="info-container">
<div id="duration" class="info"></div>
<div id="info" class="info"></div>
<div id="speedDuration" class="info"></div>
</div>
</div>
</body>
</html>
.flex-center, .flex-center_column {
display: flex;
align-items: center;
justify-content: center;
}
.flex-center_column {
flex-direction: column;
}
.container {
flex-direction: column;
padding: 0 40px;
}
.input {
margin: 10px 0;
width:100%;
height:40px;
border:1px solid #dbdbdb;
outline:none;
font-size:20px;
text-indent:10px;
}
.info-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 20px;
overflow: hidden;
box-shadow:4px 4px 9px #333333;
background: #fff;
}
.info {
padding: 0 20px;
line-height: 50px;
font-size: 18px;
color: #333;
}
.btn {
margin: 20px 0;
padding: 20px 30vw;
border-radius: 10px;
text-align: center;
box-shadow:4px 4px 9px #333333;
font-size: 18px;
color: white;
background: #2BAEFE;
}
button {
border: 0;
}
.errMsg {
font-size: 18px;
color: tomato;
}