From 88c6c01c5971f7b0def7e323ebb263f2c9604d53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:48:53 +0000
Subject: [PATCH 1/6] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/2023-11-3.md=20=E4=B8=BA=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/20231103.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20231103.md"                                                  | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename "14 \351\231\210\346\226\260\346\210\220/2023-11-3.md" => "14 \351\231\210\346\226\260\346\210\220/20231103.md" (100%)

diff --git "a/14 \351\231\210\346\226\260\346\210\220/2023-11-3.md" "b/14 \351\231\210\346\226\260\346\210\220/20231103.md"
similarity index 100%
rename from "14 \351\231\210\346\226\260\346\210\220/2023-11-3.md"
rename to "14 \351\231\210\346\226\260\346\210\220/20231103.md"
-- 
Gitee


From a708b1deba7b9334e4129e0fad912caea5a3e35a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:49:17 +0000
Subject: [PATCH 2/6] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/2023.11.30=E4=BD=9C=E4=B8=9A.md=20?=
 =?UTF-8?q?=E4=B8=BA=2014=20=E9=99=88=E6=96=B0=E6=88=90/20231130=E4=BD=9C?=
 =?UTF-8?q?=E4=B8=9A.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20231130\344\275\234\344\270\232.md"                          | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename "14 \351\231\210\346\226\260\346\210\220/2023.11.30\344\275\234\344\270\232.md" => "14 \351\231\210\346\226\260\346\210\220/20231130\344\275\234\344\270\232.md" (100%)

diff --git "a/14 \351\231\210\346\226\260\346\210\220/2023.11.30\344\275\234\344\270\232.md" "b/14 \351\231\210\346\226\260\346\210\220/20231130\344\275\234\344\270\232.md"
similarity index 100%
rename from "14 \351\231\210\346\226\260\346\210\220/2023.11.30\344\275\234\344\270\232.md"
rename to "14 \351\231\210\346\226\260\346\210\220/20231130\344\275\234\344\270\232.md"
-- 
Gitee


From 5b2100e1ee35a2d3e8c50a8df1125636b3a3e1fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:49:25 +0000
Subject: [PATCH 3/6] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/2023.12.06=E4=BD=9C=E4=B8=9A.md=20?=
 =?UTF-8?q?=E4=B8=BA=2014=20=E9=99=88=E6=96=B0=E6=88=90/20231206=E4=BD=9C?=
 =?UTF-8?q?=E4=B8=9A.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20231206\344\275\234\344\270\232.md"                          | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename "14 \351\231\210\346\226\260\346\210\220/2023.12.06\344\275\234\344\270\232.md" => "14 \351\231\210\346\226\260\346\210\220/20231206\344\275\234\344\270\232.md" (100%)

diff --git "a/14 \351\231\210\346\226\260\346\210\220/2023.12.06\344\275\234\344\270\232.md" "b/14 \351\231\210\346\226\260\346\210\220/20231206\344\275\234\344\270\232.md"
similarity index 100%
rename from "14 \351\231\210\346\226\260\346\210\220/2023.12.06\344\275\234\344\270\232.md"
rename to "14 \351\231\210\346\226\260\346\210\220/20231206\344\275\234\344\270\232.md"
-- 
Gitee


From f8c857d53b2921b8fcf453deb384530d485023ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:50:04 +0000
Subject: [PATCH 4/6] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/=E4=BD=9C=E7=94=A8=E5=9F=9F,?=
 =?UTF-8?q?=E9=97=AD=E5=8C=85,=E4=BC=AA=E4=B8=8E=E7=9C=9F=E6=95=B0?=
 =?UTF-8?q?=E7=BB=84,=E5=B1=95=E5=BC=80=E8=BF=90=E7=AE=97=E7=AC=A6,?=
 =?UTF-8?q?=E8=A7=A3=E6=9E=84,=E8=BF=87=E6=BB=A4=E5=99=A8.md=20=E4=B8=BA?=
 =?UTF-8?q?=2014=20=E9=99=88=E6=96=B0=E6=88=90/20231202=20=E8=BF=87?=
 =?UTF-8?q?=E6=BB=A4=E5=99=A8.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20231202 \350\277\207\346\273\244\345\231\250.md"             | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename "14 \351\231\210\346\226\260\346\210\220/\344\275\234\347\224\250\345\237\237,\351\227\255\345\214\205,\344\274\252\344\270\216\347\234\237\346\225\260\347\273\204,\345\261\225\345\274\200\350\277\220\347\256\227\347\254\246,\350\247\243\346\236\204,\350\277\207\346\273\244\345\231\250.md" => "14 \351\231\210\346\226\260\346\210\220/20231202 \350\277\207\346\273\244\345\231\250.md" (100%)

diff --git "a/14 \351\231\210\346\226\260\346\210\220/\344\275\234\347\224\250\345\237\237,\351\227\255\345\214\205,\344\274\252\344\270\216\347\234\237\346\225\260\347\273\204,\345\261\225\345\274\200\350\277\220\347\256\227\347\254\246,\350\247\243\346\236\204,\350\277\207\346\273\244\345\231\250.md" "b/14 \351\231\210\346\226\260\346\210\220/20231202 \350\277\207\346\273\244\345\231\250.md"
similarity index 100%
rename from "14 \351\231\210\346\226\260\346\210\220/\344\275\234\347\224\250\345\237\237,\351\227\255\345\214\205,\344\274\252\344\270\216\347\234\237\346\225\260\347\273\204,\345\261\225\345\274\200\350\277\220\347\256\227\347\254\246,\350\247\243\346\236\204,\350\277\207\346\273\244\345\231\250.md"
rename to "14 \351\231\210\346\226\260\346\210\220/20231202 \350\277\207\346\273\244\345\231\250.md"
-- 
Gitee


From f2e7173a413e1be22261aba62a55ec477305bc2c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:50:37 +0000
Subject: [PATCH 5/6] =?UTF-8?q?=E9=87=8D=E5=91=BD=E5=90=8D=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/20231107=20.md=20=E4=B8=BA=2014=20?=
 =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90/20231106=20.md?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20231106 .md"                                                 | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename "14 \351\231\210\346\226\260\346\210\220/20231107 .md" => "14 \351\231\210\346\226\260\346\210\220/20231106 .md" (100%)

diff --git "a/14 \351\231\210\346\226\260\346\210\220/20231107 .md" "b/14 \351\231\210\346\226\260\346\210\220/20231106 .md"
similarity index 100%
rename from "14 \351\231\210\346\226\260\346\210\220/20231107 .md"
rename to "14 \351\231\210\346\226\260\346\210\220/20231106 .md"
-- 
Gitee


From 3ad93c23349ed876f149f380da7069ad1bb19ee4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=96=B0=E6=88=90?=
 <11785189+beckoningchen@user.noreply.gitee.com>
Date: Wed, 13 Dec 2023 14:54:59 +0000
Subject: [PATCH 6/6] 14
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: 陈新成 <11785189+beckoningchen@user.noreply.gitee.com>
---
 ...9 \345\244\247\344\275\234\344\270\232.md" | 1800 +++++++++++++++++
 .../20231211 jQuery.md"                       |  251 +++
 .../20231212 jQ\346\241\210\344\276\213.md"   |   70 +
 3 files changed, 2121 insertions(+)
 create mode 100644 "14 \351\231\210\346\226\260\346\210\220/20231129 \345\244\247\344\275\234\344\270\232.md"
 create mode 100644 "14 \351\231\210\346\226\260\346\210\220/20231211 jQuery.md"
 create mode 100644 "14 \351\231\210\346\226\260\346\210\220/20231212 jQ\346\241\210\344\276\213.md"

diff --git "a/14 \351\231\210\346\226\260\346\210\220/20231129 \345\244\247\344\275\234\344\270\232.md" "b/14 \351\231\210\346\226\260\346\210\220/20231129 \345\244\247\344\275\234\344\270\232.md"
new file mode 100644
index 0000000..d6d73ac
--- /dev/null
+++ "b/14 \351\231\210\346\226\260\346\210\220/20231129 \345\244\247\344\275\234\344\270\232.md"	
@@ -0,0 +1,1800 @@
+# 笔记
+
+太累了，不写了
+
+
+
+# 作业
+
+# index.html
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="renderer" content="webkit">
+  <link rel="shortcut icon" href="./favicon.ico">
+  <link rel="stylesheet" href="./css/common.css">
+  <link rel="stylesheet" href="./css/index.css">
+  <link rel="stylesheet" href="https://at.alicdn.com/t/font_2143783_iq6z4ey5vu.css">
+  <script>
+    // 检测 userAgent（浏览器信息）
+    !(function () {
+      const userAgent = navigator.userAgent
+      // 验证是否为Android或iPhone
+      const android = userAgent.match(/(Android);?[\s\/]+([\d.]+)?/)
+      const iphone = userAgent.match(/(iPhone\sOS)\s([\d_]+)/)
+
+      // 如果是Android或iPhone，则跳转至移动站点
+      if (android || iphone) {
+        location.href = 'http://m.itcast.cn'
+      }
+
+    })()
+  </script>
+</head>
+
+<body>
+  <!-- 项部导航 -->
+  <div class="xtx_topnav">
+    <div class="wrapper">
+      <!-- 顶部导航 -->
+      <ul class="xtx_navs">
+        <li>
+          <a href="./login.html">请先登录</a>
+        </li>
+        <li>
+          <a href="./register.html">免费注册</a>
+        </li>
+        <li>
+          <a href="./center-order.html">我的订单</a>
+        </li>
+        <li>
+          <a href="./center.html">会员中心</a>
+        </li>
+        <li>
+          <a href="javascript:;">帮助中心</a>
+        </li>
+        <li>
+          <a href="javascript:;">在线客服</a>
+        </li>
+        <li>
+          <a href="javascript:;">
+            <i class="mobile sprites"></i>
+            手机版
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+  <!-- 头部 -->
+  <div class="xtx_header">
+    <div class="wrapper">
+      <!-- 网站Logo -->
+      <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
+      <!-- 主导航 -->
+      <div class="xtx_navs">
+        <ul class="clearfix">
+          <li>
+            <a href="./index.html">首页</a>
+          </li>
+          <li>
+            <a href="./category01.html">生鲜</a>
+          </li>
+          <li>
+            <a href="./category01.html">美食</a>
+          </li>
+          <li>
+            <a href="./category01.html">餐厨</a>
+          </li>
+          <li>
+            <a href="./category01.html">电器</a>
+          </li>
+          <li>
+            <a href="./category01.html">居家</a>
+          </li>
+          <li>
+            <a href="./category01.html">洗护</a>
+          </li>
+          <li>
+            <a href="./category01.html">孕婴</a>
+          </li>
+          <li>
+            <a href="./category01.html">服装</a>
+          </li>
+        </ul>
+      </div>
+      <!-- 站内搜索 -->
+      <div class="xtx_search clearfix">
+        <!-- 购物车 -->
+        <a href="./cart-none.html" class="xtx_search_cart sprites">
+          <i>2</i>
+        </a>
+        <!-- 搜索框 -->
+        <div class="xtx_search_wrapper">
+          <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- 分类及焦点图 -->
+  <div class="xtx_entry">
+    <div class="wrapper">
+      <!-- 分类 -->
+      <div class="xtx_category">
+        <!-- 顶级分类 -->
+        <ul class="xtx_category_super">
+          <li>
+            <a href="javascript:;">
+              生鲜
+              <small>水果</small>
+              <small>蔬菜</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li class="active">
+            <a href="javascript:;">
+              美食
+              <small>面点</small>
+              <small>干果</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              电器
+              <small>数码产品</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              居家
+              <small>床品</small>
+              <small>四件套</small>
+              <small>被枕</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              洗护
+              <small>洗发洗护</small>
+              <small>美妆</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              孕婴
+              <small>奶粉</small>
+              <small>玩具</small>
+              <small>辅食</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              餐橱
+              <small>数码产品</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              服饰
+              <small>女装</small>
+              <small>男装</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              杂货
+              <small>户外</small>
+              <small>图书</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+          <li>
+            <a href="javascript:;">
+              品牌
+              <small>品牌制造</small>
+            </a>
+            <i class="sprites"></i>
+          </li>
+        </ul>
+        <!-- 子分类 -->
+        <div class="xtx_category_subset">
+
+        </div>
+      </div>
+      <!-- 焦点图 -->
+      <div class="xtx_banner">
+
+        <ul>
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/banner_1.png" alt="">
+            </a>
+          </li>
+        </ul>
+        <!-- 切换按钮  -->
+        <a href="javascript:;" class="prev sprites"></a>
+        <a href="javascript:;" class="next sprites"></a>
+        <!-- 指示器 -->
+        <div class="indicator">
+          <span></span>
+          <span></span>
+          <span class="active"></span>
+          <span></span>
+          <span></span>
+        </div>
+
+      </div>
+    </div>
+  </div>
+  <!-- 新鲜好物 -->
+  <div class="xtx_goods_new xtx_panel">
+    <div class="wrapper">
+      <!-- 面板头部 -->
+      <div class="xtx_panel_header">
+        <h3>新鲜好物<small>新鲜出炉 品质靠谱</small></h3>
+        <a href="./index-new.html" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_1">
+        <a href="javascript:;">
+          <img src="./uploads/new_goods_1.jpg" alt="">
+          <span class="name">睿米无线吸尘器F8</span>
+          <span class="price"><small>￥</small>899</span>
+        </a>
+        <a href="javascript:;">
+          <img src="./uploads/new_goods_2.jpg" alt="">
+          <span class="name">智能环绕3D空调</span>
+          <span class="price"><small>￥</small>1299</span>
+        </a>
+        <a href="javascript:;">
+          <img src="./uploads/new_goods_3.jpg" alt="">
+          <span class="name">广东软软糯米煲仔饭</span>
+          <span class="price"><small>￥</small>129</span>
+        </a>
+        <a href="javascript:;">
+          <img src="./uploads/new_goods_4.jpg" alt="">
+          <span class="name">罗西机械智能手表</span>
+          <span class="price"><small>￥</small>3399</span>
+        </a>
+      </div>
+    </div>
+  </div>
+  <!-- 人气推荐 -->
+  <div class="xtx_goods_popular xtx_panel">
+    <div class="wrapper">
+      <!-- 面板头部 -->
+      <div class="xtx_panel_header">
+        <h3>人气推荐<small>人气爆款 不容错过</small></h3>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_1">
+        <a href="javascript:;">
+          <img src="./uploads/popular_1.jpg">
+          <span class="title">特惠推荐</span>
+          <span class="alt">我猜得到 你的需要</span>
+        </a>
+        <a href="./index-hot.html">
+          <img src="./uploads/popular_2.jpg">
+          <span class="title">爆款推荐</span>
+          <span class="alt">人气好物推荐</span>
+        </a>
+        <a href="./index-one.html">
+          <img src="./uploads/popular_3.jpg">
+          <span class="title">场景使用一站买全</span>
+          <span class="alt">编辑精心整理推荐</span>
+        </a>
+        <a href="javascript:;">
+          <img src="./uploads/popular_4.jpg">
+          <span class="title">领券中心</span>
+          <span class="alt">发现更多超值优惠券</span>
+        </a>
+      </div>
+    </div>
+  </div>
+  <!-- 热门品牌 -->
+  <div class="xtx_goods_brand xtx_panel">
+    <div class="wrapper">
+      <div class="xtx_panel_header">
+        <h3>热门品牌<small>国际经典 品质保证</small></h3>
+        <div class="page-bar">
+          <a href="javascript:;" class="prev sprites"></a>
+          <a href="javascript:;" class="next sprites active"></a>
+        </div>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_goods">
+        <ul>
+          <li>
+            <a href="./index-brand.html">
+              <img src="./uploads/brand_goods_1.jpg" alt="">
+            </a>
+            <a href="./brand-list.html">
+              <img src="./uploads/brand_goods_2.jpg" alt="">
+            </a>
+            <a href="javascript:;">
+              <img src="./uploads/brand_goods_3.jpg" alt="">
+            </a>
+            <a href="javascript:;">
+              <img src="./uploads/brand_goods_4.jpg" alt="">
+            </a>
+            <a href="javascript:;">
+              <img src="./uploads/brand_goods_5.jpg" alt="">
+            </a>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+  <!-- 分类商品 -->
+  <div class="xtx_goods_category xtx_panel">
+    <div class="wrapper">
+      <!-- 生鲜 -->
+      <div class="xtx_panel_header">
+        <h3>生鲜</h3>
+        <a href="javascript:;" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+        <div class="tabs-bar">
+          <a href="javascript:;" class="active">水果</a>
+          <a href="javascript:;">蔬菜</a>
+          <a href="javascript:;">肉禽蛋</a>
+          <a href="javascript:;">裤装</a>
+          <a href="javascript:;">衬衫</a>
+          <a href="javascript:;">内衣</a>
+        </div>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_2">
+        <ul class="clearfix">
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/fresh_goods_cover.jpg" alt="">
+            </a>
+            <div class="label">
+              <span>生鲜馆</span>
+              <span>全场3件8折</span>
+            </div>
+          </li>
+          <li>
+            <!-- 商品图片 -->
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_1.jpg" alt="">
+              </div>
+            </a>
+            <!-- 商品信息 -->
+            <div class="meta">
+              <p class="name">美威 智利原味三文鱼排 240g/袋 4片装</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>59</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_2.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">红功夫 麻辣小龙虾1.5kg 4-6钱/25-32只</p>
+              <p class="flag">火锅食材</p>
+              <p class="price"><small>￥</small>71.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_3.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">三都港 冷冻无公害黄花鱼 700g 2条 袋装</p>
+              <p class="flag">海鲜水产</p>
+              <p class="price"><small>￥</small>49.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_4.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">渔公码头 大连鲜食入味 即食海参 辽参刺参 调味海</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>899</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_5.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">越南进口白心火龙果4个 装 标准果 单果400-550g </p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>29</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_6.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">广西沃柑 柑橘1.5kg</p>
+              <p class="flag">新鲜水果</p>
+              <p class="price"><small>￥</small>59</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_7.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">进口 牛油果 6个装 单果重约130-180g</p>
+              <p class="flag">新鲜水果</p>
+              <p class="price"><small>￥</small>39.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/fresh_goods_8.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">泰国进口山竹5A级 500g </p>
+              <p class="flag">新鲜水果</p>
+              <p class="price"><small>￥</small>29.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+        </ul>
+      </div>
+
+      <!-- 服饰 -->
+      <div class="xtx_panel_header">
+        <h3>服饰</h3>
+        <a href="javascript:;" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+        <div class="tabs-bar">
+          <a href="javascript:;" class="active">行李箱</a>
+          <a href="javascript:;">男士包袋</a>
+          <a href="javascript:;">女士包袋</a>
+          <a href="javascript:;">钱包及小提袋</a>
+          <a href="javascript:;">男鞋</a>
+          <a href="javascript:;">女鞋</a>
+          <a href="javascript:;">拖鞋</a>
+        </div>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_2">
+        <ul class="clearfix">
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/clothes_goods_cover.jpg" alt="">
+            </a>
+            <div class="label">
+              <span>服饰馆</span>
+              <span>3折狂欢</span>
+            </div>
+          </li>
+          <li>
+            <!-- 商品图片 -->
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_1.jpg" alt="">
+              </div>
+            </a>
+            <!-- 商品信息 -->
+            <div class="meta">
+              <p class="name">人本秋季厚底帆布鞋 韩版低帮增高学生</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>55</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_2.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">迪士尼真皮针扣表带宽度 14-16mm规格双色压纹 女表带</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>20.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_3.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">三都港 冷冻无公害黄花鱼 700g 2条 袋装</p>
+              <p class="flag">海鲜水产</p>
+              <p class="price"><small>￥</small>209</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_4.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">ONLY夏季新款高腰宽松 七分阔腿裙裤休闲裤</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>274.5</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_5.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">拉夫劳伦t恤男正品 </p>
+              <p class="flag">圆领短袖</p>
+              <p class="price"><small>￥</small>99</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_6.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">李宁跑步鞋男鞋空气 弧2018春季款</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>79</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_7.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">Dickies男鞋2020春季 英伦休闲工装鞋低帮</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>179</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/clothes_goods_8.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">北极绒春夏季纯棉背心 男士修身纯色打底</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>69</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+        </ul>
+      </div>
+
+      <!-- 餐厨 -->
+      <div class="xtx_panel_header">
+        <h3>餐厨</h3>
+        <a href="javascript:;" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+        <div class="tabs-bar">
+          <a href="javascript:;" class="active">水果</a>
+          <a href="javascript:;">蔬菜</a>
+          <a href="javascript:;">肉禽蛋</a>
+          <a href="javascript:;">裤装</a>
+          <a href="javascript:;">衬衫</a>
+          <a href="javascript:;">内衣</a>
+        </div>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_2">
+        <ul class="clearfix">
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/kitchen_goods_cover.jpg" alt="">
+            </a>
+            <div class="label">
+              <span>餐厨馆</span>
+              <span>大额优惠<br>等你来拿</span>
+            </div>
+          </li>
+          <li>
+            <!-- 商品图片 -->
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_1.jpg" alt="">
+              </div>
+            </a>
+            <!-- 商品信息 -->
+            <div class="meta">
+              <p class="name">创意可爱不锈钢便携餐具 套装筷子便携三件套</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>5.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_2.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">三金西瓜霜竹炭牙刷软毛 成人家用家庭装</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>20.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_3.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">朴（TOPOTO）大卫免手 洗平板拖把拓扑懒人木地 板刮刮乐桶拖布</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>129</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_4.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">ONLY夏季新款高腰宽松 七分阔腿裙裤休闲裤</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>274.5</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_5.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">金纺不伤手柔顺剂 妈妈的选择</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>29</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_6.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">洁成绵柔抹布洗碗巾超 值5片装 洗锅刷碗</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>10.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_7.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">大卫双驱动旋转拖把桶 免手洗拓扑拖布地拖墩布 </p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>159</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/kitchen_goods_8.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">斧头牌（AXE）去污地板 清洁剂2L 柠檬清香 </p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>22.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+        </ul>
+      </div>
+
+      <!-- 居家 -->
+      <div class="xtx_panel_header">
+        <h3>居家</h3>
+        <a href="javascript:;" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+        <div class="tabs-bar">
+          <a href="javascript:;" class="active">咖啡具</a>
+          <a href="javascript:;">水具酒具</a>
+          <a href="javascript:;">锅具</a>
+          <a href="javascript:;">餐具</a>
+          <a href="javascript:;">功能厨具</a>
+          <a href="javascript:;">茶具</a>
+          <a href="javascript:;">清洁保鲜</a>
+        </div>
+      </div>
+      <!-- 商品列表 -->
+      <div class="xtx_panel_goods_2">
+        <ul class="clearfix">
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/home_goods_cover.jpg" alt="">
+            </a>
+            <div class="label">
+              <span>居家馆</span>
+              <span>全场满减</span>
+            </div>
+          </li>
+          <li>
+            <!-- 商品图片 -->
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_1.jpg" alt="">
+              </div>
+            </a>
+            <!-- 商品信息 -->
+            <div class="meta">
+              <p class="name">菜鸟异常专用链接 非请 勿拍</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>8999</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_2.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">【中盐软水盐】汉斯希 尔家用软水机适配</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>65</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_3.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">云米净水壶家用直饮台式 净水机渗透过滤自来水</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>129</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_4.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">ztk恒温调奶器配件玻璃壶 炖盅</p>
+              <p class="flag">海鲜年货</p>
+              <p class="price"><small>￥</small>129</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_5.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">荞麦枕头单人枕芯双人 护颈椎枕头芯</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>29</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_6.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">Bear/小熊 LLJ-B04G1 家用多功能切碎机 电动</p>
+              <p class="flag">料理机</p>
+              <p class="price"><small>￥</small>10.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_7.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">荣事达薄饼机春饼春卷皮 家用博饼机电饼铛 </p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>159</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <div class="img-box">
+                <img src="./uploads/home_goods_8.jpg" alt="">
+              </div>
+            </a>
+            <div class="meta">
+              <p class="name">美式双人实木床 红实木 显档次</p>
+              <p class="flag"></p>
+              <p class="price"><small>￥</small>22.9</p>
+            </div>
+            <!-- 其它 -->
+            <div class="extra">
+              <a href="javascript:;">
+                <span>找相似</span>
+                <span>发现现多宝贝&gt;</span>
+              </a>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+  <!-- 最新主题 -->
+  <div class="xtx_goods_topic xtx_panel">
+    <div class="wrapper">
+      <div class="xtx_panel_header">
+        <h3>最新专题</h3>
+        <a href="javascript:;" class="more">
+          查看全部<i class="sprites"></i>
+        </a>
+      </div>
+      <div class="xtx_topic">
+        <ul class="clearfix">
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/topic_goods_1.jpg" alt="">
+              <div class="meta">
+                <p class="title">
+                  吃这些美食才不算辜负自己
+                  <small>餐厨起居洗护好物</small>
+                </p>
+                <span class="price"><small>￥</small>29.9起</span>
+              </div>
+            </a>
+            <div class="social">
+              <span class="like">
+                <i class="sprites"></i>1220
+              </span>
+              <span class="view">
+                <i class="sprites"></i>1800
+              </span>
+
+              <span class="reply">
+                <i class="sprites"></i>1220
+              </span>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/topic_goods_2.jpg" alt="">
+              <div class="meta">
+                <p class="title">
+                  吃这些美食才不算辜负自己
+                  <small>餐厨起居洗护好物</small>
+                </p>
+                <span class="price"><small>￥</small>29.9起</span>
+              </div>
+            </a>
+            <div class="social">
+              <span class="liked">
+                <i class="sprites"></i>1220
+              </span>
+              <span class="view">
+                <i class="sprites"></i>1800
+              </span>
+
+              <span class="reply">
+                <i class="sprites"></i>1220
+              </span>
+            </div>
+          </li>
+          <li>
+            <a href="javascript:;">
+              <img src="./uploads/topic_goods_3.jpg" alt="">
+              <div class="meta">
+                <p class="title">
+                  吃这些美食才不算辜负自己
+                  <small>餐厨起居洗护好物</small>
+                </p>
+                <span class="price"><small>￥</small>29.9起</span>
+              </div>
+            </a>
+            <div class="social">
+              <span class="like">
+                <i class="sprites"></i>1220
+              </span>
+              <span class="view">
+                <i class="sprites"></i>1800
+              </span>
+
+              <span class="reply">
+                <i class="sprites"></i>1220
+              </span>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+  <!-- 公共底部 -->
+  <div class="xtx_footer clearfix">
+    <div class="wrapper">
+      <!-- 联系我们 -->
+      <div class="contact clearfix">
+        <dl>
+          <dt>客户服务</dt>
+          <dd class="chat">在线客服</dd>
+          <dd class="feedback">问题反馈</dd>
+        </dl>
+        <dl>
+          <dt>关注我们</dt>
+          <dd class="weixin">公众号</dd>
+          <dd class="weibo">微博</dd>
+        </dl>
+        <dl>
+          <dt>下载APP</dt>
+          <dd class="qrcode">
+            <img src="./uploads/qrcode.jpg">
+          </dd>
+          <dd class="download">
+            <span>扫描二维码</span>
+            <span>立马下载APP</span>
+            <a href="javascript:;">下载页面</a>
+          </dd>
+        </dl>
+        <dl>
+          <dt>服务热线</dt>
+          <dd class="hotline">
+            400-0000-000
+            <small>周一至周日 8:00-18:00</small>
+          </dd>
+        </dl>
+      </div>
+    </div>
+    <!-- 其它 -->
+    <div class="extra">
+      <div class="wrapper">
+        <!-- 口号 -->
+        <div class="slogan">
+          <a href="javascript:;" class="price">价格亲民</a>
+          <a href="javascript:;" class="express">物流快捷</a>
+          <a href="javascript:;" class="quality">品质新鲜</a>
+        </div>
+        <!-- 版权信息 -->
+        <div class="copyright">
+          <p>
+            <a href="javascript:;">关于我们</a>
+            <a href="javascript:;">帮助中心</a>
+            <a href="javascript:;">售后服务</a>
+            <a href="javascript:;">配送与验收</a>
+            <a href="javascript:;">商务合作</a>
+            <a href="javascript:;">搜索推荐</a>
+            <a href="javascript:;">友情链接</a>
+          </p>
+          <p>CopyRight &copy; 小兔鲜儿</p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <script>
+    // 1、 获取第一个小li
+    const li1 = document.querySelector('.xtx_navs li:first-child')
+    const li2 = li1.nextElementSibling
+    // 2. 最好做个渲染函数 因为退出登录需要重新渲染
+    function render() {
+      // 2.1 读取本地存储的用户名
+      const uname = localStorage.getItem('xtx-uname')
+      // console.log(uname)
+      if (uname) {
+        li1.innerHTML = `<a href="javascript:;"><i class="iconfont icon-user">${uname
+          }</i></a>
+        `
+        li2.innerHTML = '<a href="javascript:;">退出登录</a>'
+      } else {
+        li1.innerHTML = '<a href="./login.html">请先登录</a>'
+        li2.innerHTML = '<a href="./register.html">免费注册</a>'
+      }
+    }
+    render()  // 调用函数
+
+    // 2. 点击退出登录模块
+    li2.addEventListener('click', function () {
+      // 删除本地存储的数据
+      localStorage.removeItem('xtx-uname')
+      // 重新渲染
+      render()
+    })
+  </script>
+</body>
+
+</html>
+```
+
+
+
+# login.html
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="renderer" content="webkit">
+  <!-- <link rel="shortcut icon" href="../favicon.ico"> -->
+  <link rel="stylesheet" href="./css/common.css">
+  <link rel="stylesheet" href="./css/login.css">
+  <link rel="stylesheet" href="https://at.alicdn.com/t/font_2143783_iq6z4ey5vu.css">
+</head>
+
+<body>
+  <!-- 登录头部 -->
+  <div class="xtx-login-header">
+    <h1 class="logo"></h1>
+    <a class="home" href="./index.html">进入网站首页</a>
+  </div>
+  <!-- 登录内容 -->
+  <div class="xtx-login-main">
+    <div class="wrapper">
+      <form action="" autocomplete="off">
+        <div class="box">
+          <div class="tab-nav">
+            <a href="javascript:;" class="active" data-id="0">账户登录</a>
+            <a href="javascript:;" data-id="1">二维码登录</a>
+          </div>
+          <div class="tab-pane" style="display: block;" id="tab1">
+            <div class="link">
+              <a href="javascript:;">手机验证码登录</a>
+            </div>
+            <div class="input">
+              <span class="iconfont icon-zhanghao"></span>
+              <input required type="text" placeholder="请输入用户名称/手机号码" name="username">
+            </div>
+            <div class="input">
+              <span class="iconfont icon-suo"></span>
+              <input required type="password" placeholder="请输入密码" name="password">
+            </div>
+            <div class="agree">
+              <label for="my-checkbox">
+                <input type="checkbox"  id="my-checkbox" class="remember" name="agree">
+                <span class="iconfont icon-xuanze"></span>
+              </label>
+              我已同意 <a href="javascript:;">《服务条款》</a href="javascript:;"> 和 <a>《服务条款》</a>
+            </div>
+            <div class="button clearfix">
+              <button type="submit" class="dl">登 录</button>
+              <!-- <a class="dl" href="./center.html">登 录</a> -->
+              <a class="fl" href="./forget.html">忘记密码？</a>
+              <a class="fr" href="./register.html">免费注册</a>
+            </div>
+          </div>
+          <div class="tab-pane" style="display: none;" id="tab2">
+            <img class="code" src="./images/code.png" alt="">
+          </div>
+        </div>
+      </form>
+    </div>
+  </div>
+  <!-- 登录底部 -->
+  <div class="xtx-login-footer">
+    <!-- 版权信息 -->
+    <div class="copyright">
+      <p>
+        <a href="javascript:;">关于我们</a>
+        <a href="javascript:;">帮助中心</a>
+        <a href="javascript:;">售后服务</a>
+        <a href="javascript:;">配送与验收</a>
+        <a href="javascript:;">商务合作</a>
+        <a href="javascript:;">搜索推荐</a>
+        <a href="javascript:;">友情链接</a>
+      </p>
+      <p>CopyRight &copy; 小兔鲜儿</p>
+    </div>
+  </div>
+  <script>
+    // 1. tab栏切换  事件委托
+      let tab = document.querySelector('.tab-nav')
+      tab.addEventListener('click', function (e) {
+        document.querySelector('[data-id="1"]').classList.remove('active')
+
+        if (e.target.tagName === 'A') {
+          let id = e.target.dataset.id;
+          if (id == "0") {
+            document.querySelector('[data-id="1"]').classList.remove('active')
+            e.target.classList.add('active');
+            document.querySelector('#tab1').style.display = 'block';
+            document.querySelector('#tab2').style.display = 'none';
+
+          } else if (id == "1") {
+            document.querySelector('[data-id="0"]').classList.remove('active')
+            e.target.classList.add('active');
+            document.querySelector('#tab1').style.display = 'none';
+            document.querySelector('#tab2').style.display = 'block';
+          }
+        }
+
+      })
+
+      
+      let user=document.querySelector('[name=username]')
+      let pass=document.querySelector('[name=password]')
+      let stu=localStorage.getItem('STUDENT')
+      let obj=JSON.parse(stu)
+      console.log(obj);
+      let input=document.querySelector('#my-checkbox')
+      let btn=document.querySelector('button')
+
+      btn.addEventListener('click',function(e){
+        e.preventDefault()
+        if (input.checked===true) {
+          let username = user.value;
+          let password = pass.value;
+          let x=false;
+          for (let i = 0; i < obj.length; i++) {
+            if (obj[i].user===username && obj[i].password===password){
+              x=true;
+            }
+          }
+
+          if (x) {
+            location.href = './index.html';
+          } else {
+            alert('用户名或密码错误');
+          }
+      }else{
+        alert('你没勾选框')
+      }
+      })
+
+  
+
+    // 1.1 事件监听
+
+   
+        // 取消上一个active
+       
+        // 当前元素添加active
+
+        // 先干掉所有人  for循环
+        
+        // 让对应序号的 大pane 显示 
+      
+    // 点击提交模块
+   
+      // 判断是否勾选同意协议
+      
+      
+
+      // 记录用户名到本地存储
+     
+      // 跳转到首页
+     
+  
+  </script>
+</body>
+
+</html>
+```
+
+
+
+# register.html
+
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="renderer" content="webkit">
+  <link rel="shortcut icon" href="./favicon.ico">
+  <link rel="stylesheet" href="./css/common.css">
+  <link rel="stylesheet" href="./css/register.css">
+  <link rel="stylesheet" href="https://at.alicdn.com/t/font_2143783_iq6z4ey5vu.css">
+</head>
+
+<body>
+  <!-- 项部导航 -->
+  <div class="xtx_topnav">
+    <div class="wrapper">
+      <!-- 顶部导航 -->
+      <ul class="xtx_navs">
+        <li>
+          <a href="./login.html">请先登录</a>
+        </li>
+        <li>
+          <a href="./register.html">免费注册</a>
+        </li>
+        <li>
+          <a href="./center-order.html">我的订单</a>
+        </li>
+        <li>
+          <a href="./center.html">会员中心</a>
+        </li>
+        <li>
+          <a href="javascript:;">帮助中心</a>
+        </li>
+        <li>
+          <a href="javascript:;">在线客服</a>
+        </li>
+        <li>
+          <a href="javascript:;">
+            <i class="mobile sprites"></i>
+            手机版
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+  <!-- 头部 -->
+  <div class="xtx_header">
+    <div class="wrapper">
+      <!-- 网站Logo -->
+      <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
+      <!-- 主导航 -->
+      <div class="xtx_navs">
+        <ul class="clearfix">
+          <li>
+            <a href="./index.html">首页</a>
+          </li>
+          <li>
+            <a href="./category01.html">生鲜</a>
+          </li>
+          <li>
+            <a href="./category01.html">美食</a>
+          </li>
+          <li>
+            <a href="./category01.html">餐厨</a>
+          </li>
+          <li>
+            <a href="./category01.html">电器</a>
+          </li>
+          <li>
+            <a href="./category01.html">居家</a>
+          </li>
+          <li>
+            <a href="./category01.html">洗护</a>
+          </li>
+          <li>
+            <a href="./category01.html">孕婴</a>
+          </li>
+          <li>
+            <a href="./category01.html">服装</a>
+          </li>
+        </ul>
+      </div>
+      <!-- 站内搜索 -->
+      <div class="xtx_search clearfix">
+        <!-- 购物车 -->
+        <a href="./cart-none.html" class="xtx_search_cart sprites">
+          <i>2</i>
+        </a>
+        <!-- 搜索框 -->
+        <div class="xtx_search_wrapper">
+          <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="xtx-wrapper">
+    <div class="container">
+      <!-- 卡片 -->
+      <div class="xtx-card">
+        <h3>新用户注册</h3>
+        <form class="xtx-form">
+          <div data-prop="username" class="xtx-form-item">
+            <span class="iconfont icon-zhanghao"></span>
+            <input name="username" type="text" placeholder="设置用户名称">
+            <span class="msg" id="text1"></span>
+          </div>
+          <div data-prop="phone" class="xtx-form-item">
+            <span class="iconfont icon-shouji"></span>
+            <input name="phone" type="text" placeholder="输入手机号码  ">
+            <span class="msg" id="text2"></span>
+          </div>
+          <div data-prop="code" class="xtx-form-item">
+            <span class="iconfont icon-zhibiaozhushibiaozhu"></span>
+            <input name="code" type="text" placeholder="短信验证码">
+            <span class="msg" id="text3"></span>
+            <a class="code" href="javascript:;">发送验证码</a>
+          </div>
+          <div data-prop="password" class="xtx-form-item">
+            <span class="iconfont icon-suo"></span>
+            <input name="password" type="password" placeholder="设置6至20位字母、数字和符号组合">
+            <span class="msg" id="text4"></span>
+          </div>
+          <div data-prop="confirm" class="xtx-form-item">
+            <span class="iconfont icon-suo"></span>
+            <input name="confirm" type="password" placeholder="请再次输入上面密码">
+            <span class="msg" id="text5"></span>
+          </div>
+          <div class="xtx-form-item pl50">
+            <i class="iconfont icon-queren"></i>
+            已阅读并同意<i>《用户服务协议》</i>
+          </div>
+          <div class="xtx-form-item">
+            <button class="submit">下一步</button>
+            <!-- <a class="submit" href="javascript:;">下一步</a> -->
+          </div>
+        </form>
+      </div>
+    </div>
+  </div>
+  <!-- 公共底部 -->
+  <div class="xtx_footer clearfix">
+    <div class="wrapper">
+      <!-- 联系我们 -->
+      <div class="contact clearfix">
+        <dl>
+          <dt>客户服务</dt>
+          <dd class="chat">在线客服</dd>
+          <dd class="feedback">问题反馈</dd>
+        </dl>
+        <dl>
+          <dt>关注我们</dt>
+          <dd class="weixin">公众号</dd>
+          <dd class="weibo">微博</dd>
+        </dl>
+        <dl>
+          <dt>下载APP</dt>
+          <dd class="qrcode">
+            <img src="./uploads/qrcode.jpg">
+          </dd>
+          <dd class="download">
+            <span>扫描二维码</span>
+            <span>立马下载APP</span>
+            <a href="javascript:;">下载页面</a>
+          </dd>
+        </dl>
+        <dl>
+          <dt>服务热线</dt>
+          <dd class="hotline">
+            400-0000-000
+            <small>周一至周日 8:00-18:00</small>
+          </dd>
+        </dl>
+      </div>
+    </div>
+    <!-- 其它 -->
+    <div class="extra">
+      <div class="wrapper">
+        <!-- 口号 -->
+        <div class="slogan">
+          <a href="javascript:;" class="price">价格亲民</a>
+          <a href="javascript:;" class="express">物流快捷</a>
+          <a href="javascript:;" class="quality">品质新鲜</a>
+        </div>
+        <!-- 版权信息 -->
+        <div class="copyright">
+          <p>
+            <a href="javascript:;">关于我们</a>
+            <a href="javascript:;">帮助中心</a>
+            <a href="javascript:;">售后服务</a>
+            <a href="javascript:;">配送与验收</a>
+            <a href="javascript:;">商务合作</a>
+            <a href="javascript:;">搜索推荐</a>
+            <a href="javascript:;">友情链接</a>
+          </p>
+          <p>CopyRight &copy; 小兔鲜儿</p>
+        </div>
+      </div>
+    </div>
+  </div>
+  <script>
+
+    let data=[0,0,0,0,0];
+    let stu=[];
+
+    // 1. 发送短信验证码模块
+    let num=5;
+      let timer=''
+    function text(){
+      yzm.innerHTML=`${num}秒后重试`
+      num--
+      if (num<0) {
+        clearInterval(timer)
+        num=5
+        yzm.innerHTML=`发送验证码`
+      }
+    }
+    let yzm=document.querySelector('.code')
+    yzm.addEventListener('click',function(){
+ 
+      timer=setInterval(text,1000)
+
+    })
+  
+
+
+    // // 2. 验证的是用户名
+    let a=/^\w{6,12}$/
+    let user=document.querySelector('[name=username]')
+    let text1=document.querySelector('#text1')
+
+    user.addEventListener('change',function(){
+      let u_name=user.value
+      if (a.test(u_name)) {
+        text1.innerHTML='没毛病老铁'
+        text1.style.color = 'green';
+        data[0]=1
+        
+      }else{
+        text1.innerHTML='输入6-12位字母数字或者下划线'
+        text1.style.color = 'red';
+        data[0]=0
+      }
+    })
+    // // 3. 验证的是手机号
+    let b=/^1\d{10}$/
+    let phone =document.querySelector('[name=phone]')
+    let text2=document.querySelector('#text2')
+    phone.addEventListener('change',function(){
+      let u_phone=phone.value
+      if(b.test(u_phone)){
+        text2.innerHTML='没毛病老铁'
+        text2.style.color = 'green';
+        data[1]=1
+      }else{
+        text2.innerHTML='你确定是手机号？'
+        text2.style.color = 'red';
+        data[1]=0
+      }
+    })
+    
+
+    // // 4. 验证的是验证码
+    let c=/^[a-zA-Z0-9]{4,6}$/
+    let code =document.querySelector('[name=code]')
+    let text3=document.querySelector('#text3')
+    code.addEventListener('change',function(){
+      let u_code=code.value
+      if(c.test(u_code)){
+        text3.innerHTML='没毛病老铁'
+        text3.style.color = 'green';
+        data[2]=1
+      }else{
+        text3.innerHTML='4-6位数字或字母'
+        text3.style.color = 'red';
+        data[2]=0
+      }
+    })
+    
+    
+
+    // 5. 验证的是密码框  与账号公用正则
+    let password=document.querySelector('[name=password]')
+    let text4=document.querySelector('#text4')
+    password.addEventListener('change',function(){
+      let u_password=password.value
+      if (a.test(u_password)) {
+        text4.innerHTML='没毛病老铁'
+        text4.style.color = 'green';
+        data[3]=1
+        
+      }else{
+        text4.innerHTML='输入6-12位字母数字或者下划线'
+        text4.style.color = 'red';
+        data[3]=0
+      }
+    })
+
+
+
+    // 6. 密码的再次验证
+    let password2=document.querySelector('[name=confirm]')
+    let text5=document.querySelector('#text5')
+    password2.addEventListener('change',function(){
+      if (password2.value===password.value) {
+      text5.innerHTML='没毛病老铁铁'
+      text5.style.color = 'green'; 
+      data[4]=1
+    }else{
+      text5.innerHTML='确定？'
+      text5.style.color = 'red'; 
+      data[4]=0
+      }
+
+    })
+
+    
+
+    // // 7. 我同意
+   //我和老师心连心，老师跟我动脑筋
+
+    // 8. 提交模块
+    
+      // 判断是否勾选我同意模块 ，
+     //我和老师心连心，老师跟我动脑筋
+     
+      // 依次判断上面的每个框框 是否通过，只要有一个没有通过的就阻止
+      let btn=document.querySelector('.submit')
+      btn.addEventListener('click',function(e){
+
+        e.preventDefault()
+        let que=false;
+        for (let i = 0; i < data.length; i++) {
+          if (data[i]==1) {
+            que=true
+          }else{
+            que=false;
+            break
+          }
+        }
+        if (que=true) {
+          let student={
+            user:user.value,
+            phone:phone.value,
+            password:password.value,
+            password:password.value,
+          }
+          stu.push(student)
+          localStorage.setItem('STUDENT',JSON.stringify(stu))
+          location.href='./login.html'
+        }
+
+      })
+
+ 
+  </script>
+</body>
+
+</html>
+```
+
diff --git "a/14 \351\231\210\346\226\260\346\210\220/20231211 jQuery.md" "b/14 \351\231\210\346\226\260\346\210\220/20231211 jQuery.md"
new file mode 100644
index 0000000..00f0cba
--- /dev/null
+++ "b/14 \351\231\210\346\226\260\346\210\220/20231211 jQuery.md"	
@@ -0,0 +1,251 @@
+# 代码：
+
+```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="https://at.alicdn.com/t/c/font_3736758_vxpb728fcyh.css">
+  <!-- 引入bootstrap.css -->
+  <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.min.css" rel="stylesheet">
+  <!-- 核心样式 -->
+  <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+  <!-- 主体区域 -->
+  <div class="container">
+    <!-- 头部标题和添加按钮 -->
+    <div class="top">
+      <h3>图书管理</h3>
+      <button type="button" class="btn btn-primary plus-btn" data-bs-toggle="modal" data-bs-target=".add-modal"> + 添加 </button>
+    </div>
+    <!-- 数据列表 -->
+    <table class="table">
+      <thead class="table-light">
+        <tr>
+          <th style="width: 150px;">序号</th>
+          <th>书名</th>
+          <th>作者</th>
+          <th>出版社</th>
+          <th style="width: 180px;">操作</th>
+        </tr>
+      </thead>
+      <tbody class="list">
+        <tr>
+          <td>1</td>
+          <td>JavaScript程序设计</td>
+          <td>马特·弗里斯比</td>
+          <td>人民邮电出版社</td>
+          <td>
+            <span class="del" data-id="1">删除</span>
+            <span class="edit" data-id="1">编辑</span>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+  <!-- 新增-弹出框 -->
+  <div class="modal fade add-modal">
+    <!-- 中间白色区域 -->
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header top">
+          <span>添加图书</span>
+          <button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="modal"></button>
+        </div>
+        <div class="modal-body form-wrap">
+          <!-- 新增表单 -->
+          <form class="add-form">
+            <div class="mb-3">
+              <label for="bookname" class="form-label">书名</label>
+              <input type="text" class="form-control bookname" placeholder="请输入书籍名称" name="bookname">
+            </div>
+            <div class="mb-3">
+              <label for="author" class="form-label">作者</label>
+              <input type="text" class="form-control author" placeholder="请输入作者名称" name="author">
+            </div>
+            <div class="mb-3">
+              <label for="publisher" class="form-label">出版社</label>
+              <input type="text" class="form-control publisher" placeholder="请输入出版社名称" name="publisher">
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer btn-group">
+          <button type="button" class="btn btn-primary" data-bs-dismiss="modal"> 取消 </button>
+          <button type="button" class="btn btn-primary add-btn"> 保存 </button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- 编辑-弹出框 -->
+  <div class="modal fade edit-modal">
+    <!-- 中间白色区域 -->
+    <div class="modal-dialog">
+      <div class="modal-content">
+        <div class="modal-header top">
+          <span>编辑图书</span>
+          <button type="button" class="btn-close" aria-label="Close" data-bs-dismiss="modal"></button>
+        </div>
+        <div class="modal-body form-wrap">
+          <!-- 编辑表单 -->
+          <form class="edit-form">
+            <input type="hidden" class="id" name="id">
+            <div class="mb-3">
+              <label for="bookname" class="form-label">书名</label>
+              <input type="text" class="form-control bookname" placeholder="请输入书籍名称" name="bookname">
+            </div>
+            <div class="mb-3">
+              <label for="author" class="form-label">作者</label>
+              <input type="text" class="form-control author" placeholder="请输入作者名称" name="author">
+            </div>
+            <div class="mb-3">
+              <label for="publisher" class="form-label">出版社</label>
+              <input type="text" class="form-control publisher" placeholder="请输入出版社名称" name="publisher">
+            </div>
+          </form>
+        </div>
+        <div class="modal-footer btn-group">
+          <button type="button" class="btn btn-primary" data-bs-dismiss="modal"> 取消 </button>
+          <button type="button" class="btn btn-primary edit-btn"> 修改 </button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+  <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/js/bootstrap.min.js"></script>
+  <!-- 核心逻辑 -->
+  <script src="./js/index.js"></script>
+  <script>
+    $(document).ready(function() {
+      let creator = 'administrator';
+      let list = $('.list');
+
+      // 查询数据
+      function shua() {
+        list.empty();
+        $.ajax({
+          url: '//hmajax.itheima.net/api/books',
+          data: { creator },
+          success: function(result) {
+            let books = result.data;
+            for (let i = 0; i < books.length; i++) {
+              const { author, bookname, id, publisher } = books[i];
+              list.append(`
+                <tr>
+                  <td>${i+1}</td>
+                  <td>${bookname}</td>
+                  <td>${author}</td>
+                  <td>${publisher}</td>
+                  <td>
+                    <span class="del" data-id="${id}">删除</span>
+                    <span class="edit" data-id="${id}">编辑</span>
+                  </td>
+                </tr>
+              `);
+            }
+          },
+        });
+      }
+      shua();
+
+        // 增加数据
+        $('.add-btn').on('click', function () {
+            const form = $('.add-form');
+            const bookname = form.find('input[name="bookname"]').val();
+            const author = form.find('input[name="author"]').val();
+            const publisher = form.find('input[name="publisher"]').val();
+            console.log(bookname);
+
+            const data = {
+                bookname,
+                author,
+                publisher,
+                creator
+            };
+
+            $.ajax({
+                type: "POST",
+                url: "https://hmajax.itheima.net/api/books",
+                data: JSON.stringify(data),
+                contentType: "application/json",
+                success: function (yes) {
+                    console.log(yes);
+                    shua();
+                    form.trigger('reset');
+                    $('.add-modal').modal('hide');
+                },
+                error: function (error) {
+                    console.log(error);
+                }
+            });
+        });
+
+      // 删除数据
+      list.on('click', '.del', function(e) {
+        let id = $(this).data('id');
+        $.ajax({
+          url: `https://hmajax.itheima.net/api/books/${id}`,
+          method: 'DELETE',
+          success: function(result) {
+            shua();
+          },
+          error: function(error) {
+            console.log(error);
+          }
+        });
+      });
+
+      // 编辑数据
+      list.on('click', '.edit', function(e) {
+        let id = $(this).data('id');
+        $.get(`https://hmajax.itheima.net/api/books/${id}`, function(result) {
+          let book = result.data;
+          const form = $('.edit-form');
+          form.find('.id').val(book.id);
+          form.find('[name="bookname"]').val(book.bookname);
+          form.find('[name="author"]').val(book.author);
+          form.find('[name="publisher"]').val(book.publisher);
+          $('.edit-modal').modal('show');
+        });
+
+        //获取修改数据
+
+        $('.edit-btn').on('click', function(e) {
+          const form = $('.edit-form');
+          const id = form.find('.id').val();
+            const bookname = form.find('input[name="bookname"]').val();
+            const author = form.find('input[name="author"]').val();
+            const publisher = form.find('input[name="publisher"]').val();
+            const data = {
+                bookname,
+                author,
+                publisher,
+                creator
+            };
+          $.ajax({
+            url: `https://hmajax.itheima.net/api/books/${id}`,
+            method: 'PUT',
+            data,
+            success: function(result) {
+              console.log(result);
+              $('.edit-modal').modal('hide');
+              shua();
+            },
+            error: function(error) {
+              console.log(error);
+            }
+          });
+        });
+      });
+    });
+  </script>
+</body>
+</html>
+
+```
+
diff --git "a/14 \351\231\210\346\226\260\346\210\220/20231212 jQ\346\241\210\344\276\213.md" "b/14 \351\231\210\346\226\260\346\210\220/20231212 jQ\346\241\210\344\276\213.md"
new file mode 100644
index 0000000..603611d
--- /dev/null
+++ "b/14 \351\231\210\346\226\260\346\210\220/20231212 jQ\346\241\210\344\276\213.md"	
@@ -0,0 +1,70 @@
+# 笔记
+
+日后整理
+
+# 代码
+
+```html
+<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
+  <script>
+    // 1. 初始数据
+    const sliderData = [
+      { url: './images/slider01.jpg', title: '对人类来说会不会太超前了？', color: 'rgb(100, 67, 68)' },
+      { url: './images/slider02.jpg', title: '开启剑与雪的黑暗传说！', color: 'rgb(43, 35, 26)' },
+      { url: './images/slider03.jpg', title: '真正的jo厨出现了！', color: 'rgb(36, 31, 33)' },
+      { url: './images/slider04.jpg', title: '李玉刚：让世界通过B站看到东方大国文化', color: 'rgb(139, 98, 66)' },
+      { url: './images/slider05.jpg', title: '快来分享你的寒假日常吧~', color: 'rgb(67, 90, 92)' },
+      { url: './images/slider06.jpg', title: '哔哩哔哩小年YEAH', color: 'rgb(166, 131, 143)' },
+      { url: './images/slider07.jpg', title: '一站式解决你的电脑配置问题！！！', color: 'rgb(53, 29, 25)' },
+      { url: './images/slider08.jpg', title: '谁不想和小猫咪贴贴呢！', color: 'rgb(99, 72, 114)' },
+    ]
+
+    function shua(){
+      $('.slider-wrapper img')[0].src=sliderData[num].url;
+      $('.slider-footer p')[0].innerHTML=sliderData[num].title;
+      $('.slider-footer').css('background-color', sliderData[num].color);
+      $('li').removeClass('active');
+      $('li').eq(num).addClass('active');
+    }
+
+    let num=0
+    $('.next').click(function(){
+      if (num<7) {
+        num++
+      }else{
+        num=0
+      }
+      shua()
+    })
+
+
+    $('.prev').click(function(){
+      if (num<1) {
+        num=7
+      }else{
+        num--
+      }
+      shua()
+    })
+    
+
+  </script>
+
+
+
+
+
+<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
+
+  <script>
+$('li a').click(function(e) {
+  let index = $(this).parent().index(); 
+  $('li a').removeClass('active')
+  $('li a').eq(index).addClass('active')
+  $('.item').removeClass('active')
+  $('.item').eq(index).addClass('active')
+});
+  </script>
+
+```
+
-- 
Gitee