Java教程

JavaWeb学习分享

本文主要是介绍JavaWeb学习分享,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

JavaWeb(学校学习)

1.1 day01

事件处理模型或者委托模型

真正会java: java技术平台 JavaEE ==> WEB应用开发(MVC) SSM

1.几个基本概念:

  • 事件:用户在程序界面所进行的操作,比如单击鼠标或者输入字符,称为用户事件

  • 事件源:发生事件的对象,一般指某一具体的组件,比如:用户点击某Button,则此Button即为事件源

  • 事件处理器:指的是确定控件如何响应事件的事件过程

    TomCat中在首页面中js的应用

    <form action="">
    		姓名: <input type="text" name="name"><br>
    		密码: <input type="password" name="pass"><br>
    		<input type="submit" value="登录">
    		<input type="reset" value="重置">
              //点击按钮,会弹出对话框
    		<input type="button" value="点击" onclick="onClick()">
    	</form>
    
    	//点击超链接,会弹出对话框
    	<a href="javascript:gogo()">弹出对话框</a>
    	<script type="text/javascript">
    		function gogo(){
    			alert("弹出对话框")
    		}
    		
    		function onClick(){
    			alert("你点击我干啥?邦邦两拳!!")
    		}
    	</script>
    

2. jsp初认识

  • JSP全称Java Server Pages,是一种动态网页开发技术。它使用JSP标签在HTML网页中插入Java代码。标签通常以<%开头以%>结束

  • JSP是一种Java servlet,主要用于实现Java web应用程序的用户界面部分。网页开发者们通过结合HTML代码、XHTML代码、XML元素以及嵌入JSP操作和命令来编写JSP。

  • JSP通过网页表单获取用户输入数据、访问数据库及其他数据源,然后动态地创建网页。

  • JSP标签有多种功能,比如访问数据库、记录用户选择信息、访问JavaBeans组件等,还可以在不同的网页中传递控制信息和共享信息

  • JSP是Java EE不可或缺的一部分,是一个完整的企业级应用平台。这意味着JSP可以用最简单的方式来实现最复杂的应用

展示(基于eclipse环境) mian.jsp文件:

/*
	编码方式最好设置为UTF-8,这样程序可以识别中文
*/
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1>哈哈哈哦</h1>
    
    //java代码片段
	<%
		int x=20;
		double y=20.8;
	%>
        
	//输出x , y的值
	<%=x %>
	<%=y %>
</body>
</html>

注意:

  • TomCat 把jsp运行 结果(在java代码处生成结果)就被当做文本信息和其他前端页面一起投送到浏览器页面
  • 解决jsp小叉号问题:
    (基于eclips)右键项目 Build Path —> Configure Build Path --> Libraries --> Add Library -->Server Runtime --> 选择TomCat服务器 --> 确定应用

1.2day02

1.JSP脚本元素

  • Java脚本插入

    1. Java 代码段

      <% …%>

    2. Java声明语句

      <%! …%>主要定义变量和成员方法 变量变为了全局变量

    3. Java表达式语句

      <%= %>主要用于输出结果

  • JSP指令

    1. page指令
    2. include指令:静态包含,被包含页面没有编译(当做是我们的一样拿来用)
  • JSP动作标记

    include动态包含 方法的引用,经过编译后把结果返回到主要页面,本身页面不运行
    forword页面转向-------------->服务器端的跳转,地址栏不会改变
    客户端的跳转:超链接,地址栏里会有变化

  • JSP内置对象

2.小案例 (index.jsp)

​ 10 x 10表格

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    //10 x 10表格,每一行都会有10个数字(从1到10) tr是行。td是单元格
	<table border="1">
		<tr>
			<td>1</td>
			<td>1</td>
		</tr>
		<tr>
			<td>2</td>
			<td>2</td>
		</tr>
	</table>
	<br>
	<table border="1">
		<%
			for(int i=1;i<=10;i++)
			{
				%>
				<tr>
					<%
						for(int j=1;j<=10;j++)
						{
							%>
								<td>
									<%=j%>
								</td>
							<%
						}
					%>
				</tr>
				<%
			}
		%>
	</table>
</body>
</html>

1.3day03

1.小案例练习

<table border="1" align="center">
		<%
			for (int i = 1; i <= 10; i++) {
		%>
		<tr>
			<%
				for (int j = i; j <= i * 15; j += i) {
			%>
			<td><%=j%></td>
			<%
				}
			%>
		</tr>
		<%
			}
		%>
	</table>

效果图:

在这里插入图片描述

注意:

<%@include file="lower.jsp"%>   //把所引用的页面当做主页面的一部分,把结果显示在主页面
<jsp:include page="Active.jsp"></jsp:include>  //Active.jsp经过编译把结果返回到主页面上
<jsp:forward page="second.jsp"></jsp:forward>  //second.jsp经过编译,主页面会被替换成second.jsp这个页面

2.example3_7案例

题目:编写JSP页面 example3_7.jsp、oddNumber.jsp和evenNumbers.jsp,example3_7.jsp页面中随机获取0~10的整数,当改数为偶数时转向页面evenNumber.jsp,否则转向页面oddNumber.jsp。访问example3_7页面。

example3_7.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<%
		long num=Math.round(Math.random()*10);
	if(num%2==0){
		System.out.println("随机产生偶数数字:"+num);
		%>
			<jsp:forward page="evenNumber.jsp">
				<jsp:param value="<%=num %>" name="num"/>
			</jsp:forward>
		<%
	}
	else{
		System.out.println("随机产生奇数数字:"+num);
		%>
			<jsp:forward page="oddNumber.jsp">
				<jsp:param value="<%=num %>" name="num"/>
			</jsp:forward>
		<%
	}
	%>
</body>
</html>

evenNumber.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1 style="color:red;font-size:"30pt">我是偶数页</h1>
	产生的是偶数:
	<%=request.getParameter("num")%>
</body>
</html>

oddNumber.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1 style="color:red;font-size="30pt">我是奇数页</h1>
	产生的是奇数:
	<%=request.getParameter("num")%>
</body>
</html>

效果展示:

在这里插入图片描述

3.example3_8案例

题目:编写两个页面example3_8.jsp和computer.jsp,在页面example3_8.jsp中使用include动作标记动态包含文件computer,并向它传递一个矩形的长和宽;computer.jsp收到参数后计算矩形的面积,并显示结果。运行example3_8.jsp页面。

example3_8

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h1>计算矩形的周长和面积</h1>
	<jsp:include page="computer.jsp">
		<jsp:param value="18" name="chang"/>
		<jsp:param value="10" name="kuan"/>
	</jsp:include>
</body>
</html>

computer.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<%
	String chang= request.getParameter("chang");
	String kuan= request.getParameter("kuan");
	double c=Double.parseDouble(chang);
	double k=Double.parseDouble(kuan);
	double zc=2*(c+k);
	double mj=c*k;
	%>
		长方形的面积为:<%=mj %> <br>
		长方形的周长为:<%=zc %>

效果展示:

在这里插入图片描述

1.4day04

小项目

项目要求

在login.jsp登录界面中输入用户名和密码,会到验证页面进行验证,用户名和密码在数据库中存在则会跳转到success.jsp成功登录页面,失败则会跳转到失败页面,提醒登录错误,重新登录

  1. login.jsp页面:登录页面

    <%@page import="java.util.Scanner"%>
    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    <h1>登录界面</h1>
    <form action="<%=request.getContextPath() %>/webTwo/validate.jsp">
    	<table>
    		<tr>
    			<td>账户输入:</td>
    			<td><input type="text" name="user"></td>
    		</tr>
    		<tr>
    			<td>密码输入:</td>
    			<td><input type="password" name="passwd"></td>
    		</tr>
    		<tr>
    			<td align="center"><input type="submit" value="登录"></td>
    			<td align="center"><input type="reset" value="重置"></td>
    		</tr>
    	</table>
    </form>
    </body>
    </html>
    
  2. validate.jsp:验证页面

    <%@page import="myCn.CN"%>
    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    <h1>验证页面</h1>
    <%
    	String User="tom";
    	String pwd="jenny";
    	String user=request.getParameter("user");
    	String passwd=request.getParameter("passwd");
    	boolean result=new CN().pd(user, passwd);
    	if(result){
    		%>
    			<jsp:forward page="success.jsp"></jsp:forward>
    		<%
    	}
    	else{
    		%>
    			<jsp:forward page="fail.jsp"></jsp:forward>
    		<%
    	}
    %>
    
    </body>
    </html>
    
  3. success.jsp:成功页面

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    	<h1>登录成功</h1>
    	欢迎<%=request.getParameter("user")%>用户登录本网站
    </body>
    </html>
    
  4. fail.jsp:失败页面

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    	<h1>账号或者密码输入有误</h1>
    	<a href="login.jsp">点我返回登录页面</a>
    </body>
    </html>
    
  5. CN.java:连接数据库

    package myCn;
    
    import java.sql.Connection;
    import java.sql.DriverManager;
    import java.sql.ResultSet;
    import java.sql.SQLException;
    import java.sql.Statement;
    
    public class CN {
    	public Connection getCn(){
    		try {
                //通过初始化驱动类com.mysql.jdbc.Driver,该类就在 mysql-connector-java-5.1.26-bin.jar中
                // 1.注册 JDBC 驱动
                //Class.forName是把这个类加载到JVM中,加载的时候,就会执行其中的静态初始化块,完成驱动的初始化的相关工			//作
    			Class.forName("com.mysql.jdbc.Driver");
    			String url="jdbc:mysql://127.0.0.1:3306/np";
                //2.打开连接
    			Connection conn=DriverManager.getConnection(url,"root","root123");
    			return conn;
    		} catch (Exception e) {
    			e.printStackTrace();
    			return null;
    		}
    		
    	}
    	public boolean pd(String name,String pass) {
    		boolean flag=false;
    		Connection conn=getCn();
    		try {
                //3.执行查询
    			Statement st = conn.createStatement();
    			String sql="select * from user";
                //4.执行查询语句,并把结果集返回给集合ResultSet
    			ResultSet rs=st.executeQuery(sql);
    			while(rs.next()) {
    				String n=rs.getString("name");
    				String p=rs.getString("pass");
    				if (name.equals(n)&&pass.equals(p)) {
    					flag=true;
    				}
    			}
    		} catch (SQLException e) {
    			// TODO Auto-generated catch block
    			e.printStackTrace();
    		}
    		
    		return flag;
    	}
    }
    

1.5day05

小案例

在这里插入图片描述

  1. login.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    	输入密钥:
    	<form action="validate.jsp">
    		<input type="password" name="pwd">
    		<input type="submit" value="提交">
    	</form>
    </body>
    </html>
    
  2. validate.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    	<%
    		String pass = request.getParameter("pwd");
    		request.setAttribute("aa", "hahahhaha");
    		if(!"2019manpinde".equals(pass)){
    			//response.sendRedirect("error.jsp");
    			%>
    				<jsp:forward page="error.jsp"></jsp:forward>
    			<%
    		}
    		else{
    			out.print("2019年蛮拼的!!!");
    		}
    		//request.setAttribute("aa", "hahahhaha"); 写在这里不指行,在if语句里,页面就已经跳走了
    	%>
    </body>
    </html>
    
  3. error.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
    	<h1>密钥错误</h1>
    	<%=	request.getAttribute("aa")%>
    </body>
    </html>
    

    ​ 运行结果展示

在这里插入图片描述

谢谢您的收看,本博客记录我的学习过程,没有很多大佬写的好,写的全,毕竟我还是一个小菜鸟,哈哈,持续更新

这篇关于JavaWeb学习分享的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!