JavaWeb基础——Jsp

1、什么是JSP
这里写图片描述

<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Jsp入门(输出时间)</title>
</head>
<body>
    当前时间值是:
    <%
        Date date=new Date();
    //  out.write(date.toLocaleString());//输出方式
        String time=date.toLocaleString();
    %>
    <%=time %><!-- 脚本表达式,它的作用是就是用于向浏览器输出数据 -->

</body>
</html>

这里写图片描述
2、Jsp语法
这里写图片描述
2.1 Jsp模板元素
这里写图片描述
2.2 Jsp脚本表达式
这里写图片描述
2.3 脚本片断
这里写图片描述
这里写图片描述
这里写图片描述

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>脚本片段</title>
</head>
<body>
    <%
        int x=1;
    %>
    aaaaa
    <%
        out.print(x);
    %>
</body>
</html>

2.4 Jsp声明
这里写图片描述

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>jsp声明</title>
</head>
<body>

    <%-- <%
        public void run(){

        }
    %> 这种方法本来不支持,相当于方法里面再定义方法--%>

    <%!
        public void run(){

    }
    %><!-- 这样就可以了,它会被翻译成在方法外面定义一个方法 -->

</body>
</html>

2.5 Jsp指令
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述

include指令

head.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
jsp头<br/>

foot.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
jsp脚<br/>

静态包含

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>include指令(编译时包含,静态包含,它包含的所有jsp会编译成一个servlet,尽量用它,运行性能好)</title>
</head>
<body>
    <%@ include file="/public/head.jsp" %>
        aaaaa<br/>
    <%@ include file="/public/foot.jsp" %>
</body>
</html>

动态包含

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>动态包含(运行主页面的时候才将副页面加载进去,同时也会被翻译成3个servlet,运行时包含)</title>
</head>
<body>
    <%
        request.getRequestDispatcher("/public/head.jsp").include(request, response);
    %>
    aaaaaa
    <%
        request.getRequestDispatcher("/public/foot.jsp").include(request, response);
    %>
</body>
</html>

2.6 Jsp运行原理和九大隐式对象
这里写图片描述
九大隐式对象
这里写图片描述
这里写图片描述
这里写图片描述

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>
    aaaaaaa <%--会翻译成out输出,所以它也会缓冲,即在wowowow后面输出 --%>
    <%
        out.write("ahhaha");//后输出这个,因为这个要先输入到缓冲,然后再输到response
        response.getWriter().write("wowowow");//先输出这个,所以这两个输出对象不要同时用
    %>
</body>
</html>

这里写图片描述
这里写图片描述
这里写图片描述
这里写图片描述

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>pageContext对象访问其他域</title>
</head>
<body>
    <%
        request.setAttribute("data", "aaa");
        String data=(String)pageContext.getAttribute("data",PageContext.REQUEST_SCOPE);
        out.write(data);
    %>
    <%--    pageContext.findAttribute("data");--%>//在page request  session  application这些域中找data,若找到了就返回该属性的值
    el表达式
    ${data }//相当于pageContext.findAttribute("data");
</body>
</html>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>jsp常用标签</title>
</head>
<body>
    <%--jsp转发 --%>
    <jsp:forward page="/index.jsp"></jsp:forward>

    <%--jsp动态包含,相当于pageContext.inclue() --%>
    <jsp:include page="/1.jsp"></jsp:include>


</body>
</html>

jsp带数据

Servlet9

package cn.itcast.web;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * Servlet implementation class Servlet9
 */
@WebServlet("/Servlet9")
public class Servlet9 extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String username=request.getParameter("name");
        System.out.println(username);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doGet(request, response);
    }

}
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jsp带数据</title>
</head>
<body>
    <jsp:forward page="Servlet9">
    <jsp:param name="username" value="servlet"/>
    </jsp:forward>
</body>
</html>

2.7 el表达式
这里写图片描述

Person.java

package cn.itcast.domain;

import java.util.Date;

public class Person {
    private String name="aaa";
    private int age;
    private Date birthday;
    private Address address;
    public Person() {
        super();
        // TODO Auto-generated constructor stub
    }
    public Person(String name) {
        super();
        this.name = name;
    }
    public Address getAddress() {
        return address;
    }
    public void setAddress(Address address) {
        this.address = address;
    }
    public String getName() {
        return name;
    }
    public Date getBirthday() {
        return birthday;
    }
    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }
    public void setName(String name) {
        this.name = name;
    }
    public int getAge() {
        return age;
    }
    public void setAge(int age) {
        this.age = age;
    }

}

Address.java

package cn.itcast.domain;

public class Address {
    private String city;

    public String getCity() {
        return city;
    }

    public void setCity(String city) {
        this.city = city;
    }

}
<%@ page language="java" import="java.util.*" import="cn.itcast.domain.Person" import="cn.itcast.domain.Address" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>el表达式</title>
</head>
<body>
<!--第一种方式
<%--    <%
        String data="abcd";
        request.setAttribute("data", data);
    %>
    ${data}<%--相当于pageContext.findAttribute("data") --%>
    <br/>
 -->

 <!--第二种方式  
<%--    <%
        Person p=new Person();
        p.setName("aaaa");
        request.setAttribute("person", p);
    %>  --%>
    ${person.name}
-->

 <!--第三种方式数据存在对象中  -->
    <%-- <%
        Person p1=new Person();
        Address a=new Address();
        a.setCity("上海");
        p1.setAddress(a);
        request.setAttribute("p2",p1);
    %>
    ${p2.address.city } --%>

    <%--第四种方式:数据存在列表中 <%
        List list=new ArrayList();
        list.add(new Person("aaa"));
        list.add(new Person("bbb"));
        list.add(new Person("ccc"));

        request.setAttribute("list", list);
    %>  
    ${list[1].name } --%>

    <%--第五种方式:数据存在map集合中 <%
        Map map=new HashMap();
        map.put("aa", new Person("aaaaaaa"));
        map.put("bb", new Person("bbbbbbb"));
        map.put("cc", new Person("ccccccc"));
        map.put("111", new Person("ccccccc"));

        request.setAttribute("map", map);
    %>  
    ${map.bb.name } 
    ${map['111'].name }
    --%>    <%--用el表达式在取数据时,通常用.号,.号取不出来时,用[] --%>

    ${pageContext.request.contextPath }<%--返回当前应用:/day3  --%>
</body>
</html>

2.8 Jsp标签的使用
这里写图片描述
这里写图片描述
这里写图片描述

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>jsp:usebean标签的使用</title>
</head>
<body>
    <%--首先从page域里面找有没有person这个bean,如果有则直接返回person bean,如果没有就会实例化一个cn.itcast.domain.Person bean
    并以person为关键字存在page域中 --%>
    <jsp:useBean id="person" class="cn.itcast.domain.Person" scope="page">
        bbbb    <%--userbean标签的标签体只在userbean标签实例化bean时才执行 --%>
    </jsp:useBean>
    <%=person.getName() %>

</body>
</html>
<%@ page language="java" import="java.util.Date;"contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jsp:setProperty</title>
</head>
<body>
    <jsp:useBean id="person" class="cn.itcast.domain.Person"/>

    <jsp:setProperty property="name" name="person" value="xxx"/><%--修改person的name属性为xxx --%>

    <%=person.getName() %><%--结果为xxx --%>

    <%--用请求参数给bean的属性赋值,http://localhost:8080/day3/JspProperty.jsp?name=uuuuu&age=12 --%>
    <jsp:setProperty name="person" property="name" param="name"/>
    <jsp:setProperty name="person" property="age" param="age"/><%--支持8种基本数据类型的转换,因为我们这儿的age=12是一个字符串,但是bean要的是一个整数 --%>
    <%=person.getName() %><%--结果为uuuuu --%>
    <%=person.getAge() %><%--结果为12 --%>

    <%--http://localhost:8080/day3/JspProperty.jsp?name=uuuuu&age=12&birthday=1989-09-09 --%>
    <jsp:setProperty name="person" property="name" value="<%=new Date() %>"/>
    <%=person.getBirthday() %>



    <%--用所有的请求参数为bean赋值 --%>
    <%--http://localhost:8080/day3/JspProperty.jsp?name=uuuuu&age=12 --%>
    <jsp:setProperty name="person" property="*"/>
    <%=person.getName() %><%--结果为uuuuu --%>
    <%=person.getAge() %><%--结果为12 --%>

    <jsp:getProperty property="name" name="person"/><%--结果为uuuuu --%>
    <jsp:getProperty property="name" name="person"/><%--结果为12 --%>
</body>
</html>

2.9 Jstl+el表达式进行迭代
这里写图片描述

<%@ page language="java" import="java.util.*" import="cn.itcast.domain.Person" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>使用jstl+el完成集合迭代</title>
</head>
<body>
    <%--列表迭代取数据 <%
        List list=new ArrayList();
        list.add(new Person("aaa"));
        list.add(new Person("bbb"));
        list.add(new Person("ccc"));

        request.setAttribute("list", list);
    %>  
    <c:forEach var="person" items="${list }">
        ${person.name }<br/>
    </c:forEach>
    <!-- 结果
    aaa
    bbb
    ccc
     --> --%>


     <!--Map集合迭代取数据 -->
     <%
        Map map=new HashMap();
        map.put("aa", new Person("aaaaaaa"));
        map.put("bb", new Person("bbbbbbb"));
        map.put("cc", new Person("ccccccc"));
        map.put("111", new Person("ccccccc"));

        request.setAttribute("map", map);
     %>
     <c:forEach var="entry" items="${map }">
        ${entry.key }:${entry.value.name }
     </c:forEach>
     <!-- 结果
    aa:aaaaaaa bb:bbbbbbb cc:ccccccc 111:ccccccc 
     --> 
</body>
</html>

2.9 一个计算器的应用

CalculatorBean.java

package cn.itcast.Calculator;

import java.math.BigDecimal;

//封装计算器数据的bean
public class CalculatorBean {
    private String firstNum="0";
    private char operator='+';
    private String secondNum="0";
    private String result;
    public String getFirstNum() {
        return firstNum;
    }
    public void setFirstNum(String firstNum) {
        this.firstNum = firstNum;
    }
    public char getOperator() {
        return operator;
    }
    public void setOperator(char operator) {
        this.operator = operator;
    }
    public String getSecondNum() {
        return secondNum;
    }
    public void setSecondNum(String secondNum) {
        this.secondNum = secondNum;
    }
    public String getResult() {
        return result;
    }
    public void setResult(String result) {
        this.result = result;
    }
    public void calculate() {
        BigDecimal first=new BigDecimal(this.firstNum);
        BigDecimal second=new BigDecimal(this.secondNum);
        switch(this.operator) {
            case'+':{
                this.result=first.add(second).toString();
                break;
            }
            case'-':{
                this.result=first.subtract(second).toString();          
                break;
            }
            case'*':{
                this.result=first.multiply(second).toString();
                break;
            }
            case'/':{
                if(second.doubleValue()==0) {
                    throw new RuntimeException("被除数不能为0");
                }
                this.result=first.divide(second, 20, BigDecimal.ROUND_HALF_UP).toString();
                break;
            }
            default:
                throw new RuntimeException("运算符只能是:+-*/");
        }
    }

}

calculator.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计算器</title>
</head>
<body style="text-align:center;">

    <jsp:useBean id="calculatorBean" class="cn.itcast.Calculator.CalculatorBean"/>
    <jsp:setProperty property="*" name="calculatorBean"/>
    <%
        try{
            calculatorBean.calculate(); 
        }catch(Exception e){
            out.write(e.getMessage());
        }

    %>
    <br/>--------------------------------------<br/>
    计算结果是:
    <jsp:getProperty property="firstNum" name="calculatorBean"/>
    <jsp:getProperty property="operator" name="calculatorBean"/>
    <jsp:getProperty property="secondNum" name="calculatorBean"/>
    =
    <jsp:getProperty property="result" name="calculatorBean"/>
    <br/>---------------------------------------<br/>


    <form action="calculator.jsp" method="post">
    <table width="40%" border="1">
        <tr>
            <td colspan="2">简单的计算器</td>
        </tr>

        <tr>
            <td>第一个参数:</td>
            <td>
                <input type="text" name="firstNum"/>
            </td>
        </tr>

        <tr>
            <td>操作符</td>
            <td>
                <select name="operator">
                    <option value="+">+</option>
                    <option value="-">-</option>
                    <option value="*">*</option>
                    <option value="/">/</option>
                </select>
            </td>
        </tr>

        <tr>
            <td>第二个参数:</td>
            <td>
                <input type="text" name="secondNum"/>
            </td>
        </tr>

        <tr>
            <td colspan="2">
                <input type="submit" value="计算"/>
            </td>
        </tr>

    </table>
    </form>
</body>
</html>

这里写图片描述
2.10 Jsp页面错误
这里写图片描述

其他(css里面的一些定位技巧)

浮动
这里写图片描述
这里写图片描述

相对定位
这里写图片描述
这里写图片描述

绝对定位
这里写图片描述
这里写图片描述
这里写图片描述

JSP(JavaServer Pages)是一种服务器端的动态网页开发技术,它可以将 Java 代码嵌入 HTML 页面中,从而实现动态网页的生成。 JSP 的基本原理是将 JSP 页面翻译成 Servlet,在服务器端执行 Servlet 代码,再将执行结果返回给客户端。因此,我们在使用 JSP 开发网页时,需要先了解 Servlet 的相关知识。 JSP 的语法基本上就是 HTML 标签加上 Java 代码。以下是一些基本的 JSP 标签: 1. <% ... %>:嵌入 Java 代码,可以用于定义变量、写循环、判断语句等。 2. <%= ... %>:输出 Java 代码的执行结果。 3. <%-- ... --%>:注释,不会被翻译成 Servlet。 4. <jsp:include ... />:包含其他 JSP 页面或 HTML 页面。 5. <jsp:forward ... />:将请求转发到其他资源(JSP 页面、Servlet 或 HTML 页面)。 6. <jsp:useBean ... />:创建 JavaBean 对象。 7. <jsp:setProperty ... />:为 JavaBean 对象设置属性。 8. <jsp:getProperty ... />:取得 JavaBean 对象的属性值。 在 JSP 页面中,我们还可以使用 EL 表达式和 JSTL 标签库来简化代码编写,提高开发效率。 EL(Expression Language)表达式是一种简化的表达式语言,可以用于取值、赋值、计算等操作。例如,${name} 表示取得名为 name 的变量的值。 JSTL(JavaServer Pages Standard Tag Library)是一套标签库,提供了循环、条件判断、格式化、国际化等常用功能的标签。例如,<c:forEach> 标签可以用于循环遍历集合,<c:if> 标签可以用于条件判断。 除了以上标签库,JSP 还支持自定义标签库。我们可以通过编写标签处理器来扩展 JSP 的功能。 JSP 的优点是可以将 Java 代码嵌入 HTML 页面中,使得网页的开发更加灵活和方便。但是,由于 JSP 页面需要翻译成 Servlet,因此会增加服务器的负担和响应时间。此外,JSP 页面中夹杂着 Java 代码,也不利于代码的维护和调试。因此,在开发大型网站时,建议使用 MVC 设计模式,将业务逻辑和视图分离,使得代码更加清晰和易于维护。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值