动态网站开发学习笔记06：JSP技术

不念不忘少年蓝@ 2024-05-07 17:06 71阅读 0赞

#### 文章目录 ####

*  一、JSP
 *   *  编写第一个JSP
     *   *  1、创建Web项目
         *  2、修改Artifact名称，重新部署项目
         *  3、创建欢迎JSP页面
         *  4、启动服务器，查看结果
 *  二、JSP基本语法
 *   *  JSP页面的基本构成
     *   *  1、JSP页面构成
         *  2、案例演示 - 显示系统当前时间
     *  JSP脚本元素
     *   *  1、JSP Scriptlet
         *   *  案例演示
     *  请添加图片描述
     *   *  案例演示
         *  案例演示
         *  ）案例演示
         *  案例演示
         *  案例演示
         *  案例演示
         *  案例演示
         *  、案例演示
         *  、案例演示
         *  案例演示
         *  案例演示
         *  案例演示

## 一、JSP ##

### 编写第一个JSP ###

目标：掌握JSP文件的编写

#### 1、创建Web项目 ####

创建Java Enterprise，添加Web Application![请添加图片描述][0589615fccb24d3c8dc9f58e1f6fc7dd.png]  
设置项目名称与保存位置![请添加图片描述][871db2e5b2b14f92b4faab1769408584.png]  
单击【Finish】按钮![请添加图片描述][cc3481d34cc6444098f2d124e7d471cb.png]

#### 2、修改Artifact名称，重新部署项目 ####

在项目结构窗口里修改Artifact名称![请添加图片描述][29077e9e82464e598a683f6e93d8d50e.png]  
在服务期配置窗口里，重新部署项目![请添加图片描述][28c4cff4aa464c3d9e8c1865881f4684.png]  
切换到【Server】选项卡，设置默认浏览器![请添加图片描述][2a719ffa727d4b7682d06ea33d585914.png]

#### 3、创建欢迎JSP页面 ####

在web目录里创建welcome.jsp  
![请添加图片描述][8ecec752eba6483fb6d803ccbd3def3a.png]  
![请添加图片描述][b513caa6ee964b88839d75be76221f7a.png]  
![请添加图片描述][bf58fa81c1054803bc418427fb637301.png]  
注意：由welcome.jsp页面可知，新创建的JSP文件与传统的HTML文件几乎没有什么区别，唯一的区别是默认创建时，页面代码最上方多了一条page指令，并且该文件的后缀名是jsp，而不是html。  
修改welcome.jsp![请添加图片描述][d28373271a1041d19dc368eb59e6c6f4.png]

#### 4、启动服务器，查看结果 ####

启动服务器，访问http://localhost:8080/JSPDemo/welcome.jsp![请添加图片描述][cc81bf76164c46d0bfe31fa9db3e3263.png]  
注意：welcome.jsp的标签中添加的内容已被显示出来，这说明HTML元素可以被JSP容器解析。实际上，JSP只是在原有的HTML文件中加入了一些具有Java特点的代码，这些称为JSP的语法元素。  
课堂练习：修改首页，显示如下图所示![请添加图片描述][579bb2b66543456a996bea7ef819eb08.png]

## 二、JSP基本语法 ##

### JSP页面的基本构成 ###

目标：熟悉JSP的页面的基本构成

#### 1、JSP页面构成 ####

虽然已经创建过JSP文件，但是并未对JSP文件的页面构成进行详细介绍。一个JSP页面可以包括指令标识、HTML代码、JavaScript代码、嵌入的Java代码、注释和JSP动作标识等内容。

#### 2、案例演示 - 显示系统当前时间 ####

创建time\_info.jsp页面  
![请添加图片描述][4103d90f4d24464c9fb3d7c0de6fc6c1.png]

<%@ page import="java.text.SimpleDateFormat" %>
    <%@ page import="java.util.Date" %>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP页面 - 显示系统当前时间</title>
        </head>
        <body>
            
            <%
                Date date = new Date();
                // year, month, day, hour, minute, second
                SimpleDateFormat sdf = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss");  
                String currentTime = sdf.format(date);
            %>
            
            <h3 style="text-align: center">系统当前时间：<%= currentTime%></h3>
        </body>
    </html>

页面构成说明图  
![请添加图片描述][1eb0196d3b7046baba2bcef9a9ea69cb.png]  
启动服务器，访问http://localhost:8080/JSPDemo/time\_info.jsp![请添加图片描述][67fe26cc743541e9acf4242874ca2568.png]

### JSP脚本元素 ###

#### 1、JSP Scriptlet ####

##### 案例演示 #####

创建demo01.jsp页面  
![请添加图片描述][74904dc4cf4b4236a6a8d82e04d0cfd2.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP Scriptlets</title>
        </head>
        <body>
            <%
                int a = 100, b = 150; // 定义两个整型变量
                int sum = a + b; // 计算两个整数之后
                // 利用JSP隐式对象`out`输出结果
                out.print(a + " + " + b + " = " + sum);
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo01.jsp![请添加图片描述][cb06e1310dc64c8188957bf2e1ef69b9.png]

### ![请添加图片描述][4c0d7d3a1d1846718321460a73ef03c2.png] ###

案例演示  
创建demo02.jsp页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP声明标识</title>
        </head>
        <body>
            <%!
                // 定义阶乘函数
                public long factorial(int n) {
                    long jc = 1;
                    for (int i = 1; i <= n; i++) {
                        jc = jc * i;
                    }
                    return jc;
                }
            %>
            <%
                // 输出10的阶乘值
                out.println("10! = " + factorial(10));
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo02.jsp![请添加图片描述][d6651dcf5d084f52a7eab267e0024fe5.png]

#### 案例演示 ####

创建demo03.jsp页面![请添加图片描述][d5f06edeb50546de9600203444aefe2b.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP表达式</title>
        </head>
        <body>
            <%!
                int a = 100, b = 150; // 声明两个整型变量
            %>
            sum = <%= a + b%> 
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo03.jsp![请添加图片描述][46cf528a1b664d37ad9496ddeed45c49.png]

#### 案例演示 ####

创建demo04.jsp页面  
![请添加图片描述][481ac1284ad744dd89a6c5d85e8c8089.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>带有JSP表达式的注释</title>
        </head>
        <body>
            <%!
                /**
                 * @param a
                 * @param b
                 * @return a + b
                 */
                public int sum(int a, int b) {
                    /*
                     * a, b都是形式参数
                     */
                    return a + b; // 返回两个整数之和
                }
            %>
            <%
                int a = 100, b = 150; // 定义两个整型变量
                int sum = sum(a, b); // 调用求和函数计算两个整数之和，此处a，b是实际参数
                out.print("sum = " + sum); // 输出求和结果
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo04.jsp![请添加图片描述][71c4dbcd3b1a41a6b7b7a6f2ba0e6287.png]

#### ）案例演示 ####

创建demo05.jsp页面  
![请添加图片描述][c43126a226a8459a8f5307601d8b7535.png]

<%@ page import="java.util.Date" %>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP注释</title>
        </head>
        <body>
            <h1>学习JSP元素</h1> 
            <%= new Date()%> <%--JSP注释：用JSP表达式元素显示当前日期--%>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo05.jsp![请添加图片描述][3b722a40b6714d8586857e47776f8a93.png]  
在打开的页面中点击鼠标右键，在弹出菜单中选择“查看网页源代码“选项![请添加图片描述][d38e0dac7bff4fe099d8390e0b554e20.png]

#### 案例演示 ####

创建demo06.jsp页面

<%@ page import="java.util.Date" %>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>动态注释</title>
        </head>
        <body>
            随机数：<%= Math.random() %> 
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo06.jsp![请添加图片描述][43954cbff66e4bbc90bcea686f791cdd.png]  
在打开的页面中点击鼠标右键，在弹出菜单中选择“查看网页源代码“选项![请添加图片描述][217893f2e2e9489d947ef2116516e2f6.png]

#### 案例演示 ####

page指令的常见属性中除了import属性外，其他的属性都只能出现一次，否则会编译失败。  
创建错误之后跳转的页面error.jsp![请添加图片描述][0c1ef4055e66492ea63cbcf4229db901.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" isErrorPage="true" %>
    <html>
        <head>
            <title>错误页面</title>
        </head>
        <body>
            <h3 style="text-align: center">错误信息：<%= exception.getMessage() %></h3>
        </body>
    </html>

创建demo07.jsp页面![请添加图片描述][4d7f2a416bec4853bdc2255586a124cf.png]

<%@ page import="java.text.SimpleDateFormat" %>
    <%@ page import="java.util.Date" %>
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>JSP页面 - 显示系统时间</title>
        </head>
        <body>
            
            <%
                Date date = new Date();
                // year, month, day, hour, minute, second
                SimpleDateFormat sdf = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss");
                String currentTime = sdf.format(date);
            %>
            
            <h3 style="text-align: center">系统当前时间：<%= currentTime%></h3>
        </body>
    </html>

查看页面指令![请添加图片描述][199848a26e564bdaad05866ee3063555.png]  
上面红框中的代码使用了page指令的language、contentType、pageEncoding和import属性。需要注意的是，page指令对整个页面都有效，而与其书写的位置无关，但是习惯上把page指令写在JSP页面的最前面。

启动服务期，访问http://localhost:8080/JSPDemo/demo07.jsp  
![请添加图片描述][b033012d1f0c4b69a8b4419aecf40c06.png]  
修改demo07.jsp页面，故意让Java代码犯错![请添加图片描述][32fac74de2e74eca9d0850e09cd9d33a.png]  
启动服务期，访问http://localhost:8080/JSPDemo/demo07.jsp，显示系统默认错误页面![请添加图片描述][deda4246aa594e4193c4c368b89efe69.png]  
如果demo07.jsp指定错误页面error.jsp![请添加图片描述][a026e49882c849eab847a56a59ee9e04.png]  
如果demo07.jsp指定错误页面error.jsp![请添加图片描述][8add3b9b088241ce8097bf04148f1982.png]  
如果demo07.jsp指定错误页面error.jsp![请添加图片描述][8fa77a11f2c741c5af95f5354240e599.png]

#### 案例演示 ####

创建demo08.jsp页面![请添加图片描述][79e33e3076644653a2b903cb661f233e.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>欢迎页面</title>
        </head>
        <body>
            <h1 style="color: blue; text-align: center">欢迎访问JSP世界~</h1>
            <%@ include file="time_info.jsp"%>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo08.jsp![请添加图片描述][59149f2e1e2a4c2486f85626e6ef76f4.png]  
![请添加图片描述][958343da601240768d54f164d9a9c21c.png]  
启动服务器，访问http://localhost:8080/JSPDemo/demo08.jsp，一样可以显示出被包含页面的内容![请添加图片描述][0abc5a1c17e44083a657142d12c13475.png]

#### 案例演示 ####

在WEB-INF里创建lib目录，添加两个jar包![请添加图片描述][d9b581b4966c442b82c62f58b0e7f96d.png]  
将库添加到项目![请添加图片描述][964a29efc0e2474fa9a76caab651a6ad.png]  
单击【Add as Library…】![请添加图片描述][e24b658f39654a21addda27ebaf6ab88.png]  
单击【OK】按钮![请添加图片描述][df293914347c49219a3e6b4efecda20a.png]  
创建demo09.jsp页面![请添加图片描述][dd7acdb64ebb42d5aea99bb90eda7534.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <html>
        <head>
            <title>JSTL核心库演示</title>
        </head>
        <body>
            <c:set var="message" value="欢迎访问JSP世界~"/>
            <h1 style="text-align: center"><c:out value="${message}"/></h1>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo09.jsp![请添加图片描述][58756dc95d8c4a09a25d85fee3614247.png]  
如果不使用JSTL核心标签库，采用JSP代码实现相同功能![请添加图片描述][6ebb39316a8447a88ad0f90729f5ca35.png]  
启动服务器，访问http://localhost:8080/JSPDemo/demo09.jsp![请添加图片描述][c2bc2d54bf6f4cfb925df44cf6b7fc79.png]

#### 、案例演示 ####

创建demo10.jsp页面![请添加图片描述][1f522f511772463c964c13de7958aa55.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>被包含的页面</title>
        </head>
        <body style="text-align: center">
            <%
                Thread.sleep(5000); // 线程休眠5秒
            %>
            红豆生南国<br>
            春来发几枝<br>
            愿君多采撷<br>
            此物最相思<br>
        </body>
    </html>

创建demo11.jsp页面，引入demo10.jsp页面。demo10.jsp作为被引入的文件，让它暂停5秒钟后再输出内容，这样，可以方便测试jsp:include元素的flush属性。![请添加图片描述][b2104b1d2de249ab9c6f2cd970e181a7.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>引入被包含的页面</title>
        </head>
        <body>
            <h3 style="text-align: center">相思</h3>
            <jsp:include page="demo10.jsp" flush="true"/>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo11.jsp，发现浏览器首先会显示demo11.jsp页面中的输出内容，等待5秒后，才会显示demo10.jsp页面的输出内容，说明被引用的资源demo10.jsp在当前JSP页面输出内容后才被调用。  
![请添加图片描述][aa3d04d8b63a4b9ca9ecef811f2364d8.gif]  
demo11.jsp页面最终显示效果![请添加图片描述][a1a355592e2c44bb8ff5eebdddbfb114.png]

#### 、案例演示 ####

创建demo12.jsp页面  
![请添加图片描述][0c2f2ab82d5343a4820a172903ed2dab.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>演示请求转发元素</title>
        </head>
        <body>
            <h1 style="text-align: center">演示请求转发元素</h1>
            <%
                Thread.sleep(5000); // 线程休眠5秒
            %>
            <jsp:forward page="welcome.jsp"/> 
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo12.jsp，发现浏览器不会显示demo12.jsp页面中的输出内容，等待5秒后才会显示welcome.jsp页面的内容。![请添加图片描述][eb6277e66a98446692c6df5db920b22b.gif]  
demo12.jsp页面最终显示效果，虽然请求转发到了welcome.jsp页面，但是地址栏依然是demo12.jsp![请添加图片描述][4409a14a1552455789061e3e982920e9.png]

#### 案例演示 ####

创建demo13.jsp页面![请添加图片描述][ea50cc271e0b4271a0c7283bcf6c0daa.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>演示out对象的用法</title>
        </head>
        <body>
            <%
                out.println("第1行：Web开发很有意思~<br />");
                response.getWriter().println("第2行：我们来学Web开发~<br />");
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo13.jsp![请添加图片描述][e6d54e96fa2d42a18c9bae46258ae2c3.png]  
![请添加图片描述][f52ab1e5561d4843b08683f04b6642f3.png]  
启动服务器，访问http://localhost:8080/JSPDemo/demo13.jsp![请添加图片描述][dc07f69c01384f07b45c74501008c449.png]

#### 案例演示 ####

创建demo14.jsp页面![请添加图片描述][1a1240b2c2a6447e848baac71dbbdd96.png]

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
        <head>
            <title>演示pageContext对象</title>
        </head>
        <body>
            <%
                // 获取out对象
                JspWriter myOut = pageContext.getOut();
                // 设置page范围内属性
                pageContext.setAttribute("message", "学习Java基础编程", pageContext.PAGE_SCOPE);
                // 设置request范围内属性
                request.setAttribute("message", "学习Java Web开发");
                // 设置session范围内属性
                session.setAttribute("message", "学习Spring Boot框架");
                // 设置application范围内属性
                application.setAttribute("message", "学习大数据实时处理");
                // 获取page范围属性
                String pageMessage = (String)pageContext.getAttribute("message", pageContext.PAGE_SCOPE);
                // 获取request范围属性
                String requestMessage = (String)pageContext.getAttribute("message", pageContext.REQUEST_SCOPE);
                // 获取session范围属性
                String sessionMessage = (String)pageContext.getAttribute("message", pageContext.SESSION_SCOPE);
                // 获取application范围属性
                String applicationMessage = (String)pageContext.getAttribute("message", pageContext.APPLICATION_SCOPE);
            %>
            <%
                myOut.println("page范围消息：" + pageMessage + "<br />");
                myOut.println("request范围消息：" + requestMessage + "<br />");
                myOut.println("session范围消息：" + sessionMessage + "<br />");
                myOut.println("application范围消息：" + applicationMessage + "<br />");
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo14.jsp![请添加图片描述][dbcd5e6d32ac43fdb2cfc45633c774b7.png]

#### 案例演示 ####

查看前面创建的error.jsp页面  
![请添加图片描述][c71c7eb0a9274d75b07c494e90058ce3.png]  
创建demo15.jsp页面![请添加图片描述][1f299acce72644d2bfbadda64dadf974.png]

<%@ page contentType="text/html;charset=UTF-8" language="java"
        pageEncoding="UTF-8" errorPage="error.jsp" %>
    <html>
        <head>
            <title>演示页面异常</title>÷
        </head>
        <body>
            <%
                int a = 10;
                int b = 0;
            %>
            <%
                out.print(a + " ÷ " + b + " = " + (a / b));  // 产生异常
            %>
        </body>
    </html>

启动服务器，访问http://localhost:8080/JSPDemo/demo15.jsp![请添加图片描述][b9789425dbe04aaea9797973229e4c16.png]

[0589615fccb24d3c8dc9f58e1f6fc7dd.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/ee40b10575a64c849b981aa816aeac99.png
[871db2e5b2b14f92b4faab1769408584.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/784d6839e1cb468894ca1532501d4372.png
[cc3481d34cc6444098f2d124e7d471cb.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1b3ee7e4a502430283ca8dad9e1c7392.png
[29077e9e82464e598a683f6e93d8d50e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/6b699223d44d4f418a6744f659991455.png
[28c4cff4aa464c3d9e8c1865881f4684.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/af6dbcf4e4a54d0caea9b935973a62ad.png
[2a719ffa727d4b7682d06ea33d585914.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/0c3da2468c384ef49df9c91c17f98913.png
[8ecec752eba6483fb6d803ccbd3def3a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/96fc5a528e524a66b0d67080fafefc34.png
[b513caa6ee964b88839d75be76221f7a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/c4bd5662adb84217bbf249e82e5c8566.png
[bf58fa81c1054803bc418427fb637301.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/15b62153e2734f8583b58eb7f03e7861.png
[d28373271a1041d19dc368eb59e6c6f4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/5301605fcad141c69943ca1527683bce.png
[cc81bf76164c46d0bfe31fa9db3e3263.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/ddaa577c56c740a390bdd6c0820ba64a.png
[579bb2b66543456a996bea7ef819eb08.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/f80152e58af648f28e302bfb2b8cc002.png
[4103d90f4d24464c9fb3d7c0de6fc6c1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/ea4b93e906b54c218dafe5ca55508f03.png
[1eb0196d3b7046baba2bcef9a9ea69cb.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/be16db8ffe304826b00e928303eae860.png
[67fe26cc743541e9acf4242874ca2568.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/f91be2a52e0a4b2b9acda584a9a3e1e7.png
[74904dc4cf4b4236a6a8d82e04d0cfd2.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/2d5dfd2583844f82b95458d395a702c1.png
[cb06e1310dc64c8188957bf2e1ef69b9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/dc44df7951bf4e8bbe0c95581f499bc0.png
[4c0d7d3a1d1846718321460a73ef03c2.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/69b3b84e887c43e684146f0bb3670a91.png
[d6651dcf5d084f52a7eab267e0024fe5.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/a43424f700ce42e38bc60b00a8f8945c.png
[d5f06edeb50546de9600203444aefe2b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/78ad83b3773b49df80995a1d4e1f11fa.png
[46cf528a1b664d37ad9496ddeed45c49.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/6017e4004da94827ad392c7a6f21b8df.png
[481ac1284ad744dd89a6c5d85e8c8089.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/3e7cc2207f5a4efeb1258aea872b66fd.png
[71c4dbcd3b1a41a6b7b7a6f2ba0e6287.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/2ecc050ea999418792ae22e87ab7016b.png
[c43126a226a8459a8f5307601d8b7535.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/88555364d9874a15b30a949e1fcb5f88.png
[3b722a40b6714d8586857e47776f8a93.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/8f3a4f17889740279f8cd495fa7cb64c.png
[d38e0dac7bff4fe099d8390e0b554e20.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/7b406964b52e4783a0edf3ffe293c35c.png
[43954cbff66e4bbc90bcea686f791cdd.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/d964bb49eee347d08fc965cfa6e5f7c3.png
[217893f2e2e9489d947ef2116516e2f6.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/4e81299b4ee24b9bbf73b030d47b26c7.png
[0c1ef4055e66492ea63cbcf4229db901.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/ea0f2da2f05d4fb9948211096a1c8503.png
[4d7f2a416bec4853bdc2255586a124cf.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/443e7dea3d3b44aabc600ef4d2ae1c47.png
[199848a26e564bdaad05866ee3063555.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1fda6bd38bde4dfd993e1556e95fd94e.png
[b033012d1f0c4b69a8b4419aecf40c06.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/10e0c9d04c184c4e9789027f11a8b011.png
[32fac74de2e74eca9d0850e09cd9d33a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/6f9a7bb9a4bf4b79b96d571236a57b3d.png
[deda4246aa594e4193c4c368b89efe69.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1d9d78af05f147de9262e9aec60428be.png
[a026e49882c849eab847a56a59ee9e04.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/ed5ee0b96b0e44d1871049174b949c48.png
[8add3b9b088241ce8097bf04148f1982.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/fa4773c129514c1f8226e7f28a60f23f.png
[8fa77a11f2c741c5af95f5354240e599.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/2e39052ef2864522b40afa843a5d267e.png
[79e33e3076644653a2b903cb661f233e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/989ec6cd51dc48048c634da2f787203a.png
[59149f2e1e2a4c2486f85626e6ef76f4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/cdffb3f6e9c543abbbdaf22e8545bc2c.png
[958343da601240768d54f164d9a9c21c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/20f1c7f2580f4a899ab1eae2d527515d.png
[0abc5a1c17e44083a657142d12c13475.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1c74c29b2e9e456da266eceb7cf217fb.png
[d9b581b4966c442b82c62f58b0e7f96d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/0af8cef497864c8ab19b12ccc6727964.png
[964a29efc0e2474fa9a76caab651a6ad.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1c98bb4cbf114f56828931e36e5c5d0d.png
[e24b658f39654a21addda27ebaf6ab88.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/7d32f2399bdc4b4387a49e1a67aadb50.png
[df293914347c49219a3e6b4efecda20a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/685aa57581e84bb1b2518786a2d0b193.png
[dd7acdb64ebb42d5aea99bb90eda7534.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/9c5dd0b6194f41f2a8a58349ff7fd469.png
[58756dc95d8c4a09a25d85fee3614247.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/cb236b3b8f254e82861b02af74142235.png
[6ebb39316a8447a88ad0f90729f5ca35.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1483ef08c7ac4aa4b58fcb1f45a14c29.png
[c2bc2d54bf6f4cfb925df44cf6b7fc79.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/0150ac1c88604f9aa3f9441794e5f48b.png
[1f522f511772463c964c13de7958aa55.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/5500313a9e1942c68d122ef102d80d90.png
[b2104b1d2de249ab9c6f2cd970e181a7.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/88baa5ffb98342238258aa7110ccb77b.png
[aa3d04d8b63a4b9ca9ecef811f2364d8.gif]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/13585be1082040f89e182aad5808acad.gif
[a1a355592e2c44bb8ff5eebdddbfb114.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/e657da6eec59471886eaa50f0e07fb0d.png
[0c2f2ab82d5343a4820a172903ed2dab.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/3be2be831d5c4768a06a9ab918a9a4b5.png
[eb6277e66a98446692c6df5db920b22b.gif]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/b499d8765b834a89946a7d03d0f403d5.gif
[4409a14a1552455789061e3e982920e9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/1ac096588a3a4ebc973ea83d918ca3e4.png
[ea50cc271e0b4271a0c7283bcf6c0daa.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/778805a004ed4befb6b74ec230cc0c24.png
[e6d54e96fa2d42a18c9bae46258ae2c3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/c720071c4e3748b7b80dd37a5c637b1a.png
[f52ab1e5561d4843b08683f04b6642f3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/6d2ada87e9714a5b87c24288f3c3a9df.png
[dc07f69c01384f07b45c74501008c449.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/233cff7d5e414948ac41ab4f6d8a5fdb.png
[1a1240b2c2a6447e848baac71dbbdd96.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/7b2cc2e8bf034ae7996fec544e135701.png
[dbcd5e6d32ac43fdb2cfc45633c774b7.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/792f76fa2fa9469981dbc23d4f7801ce.png
[c71c7eb0a9274d75b07c494e90058ce3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/f78e160ad37a427087c418d9edfe0572.png
[1f299acce72644d2bfbadda64dadf974.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/6baf0ee880f146a09830c05aba6ab526.png
[b9789425dbe04aaea9797973229e4c16.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/07/7e1d873775ac40a182ea4ce906de182b.png