JSP
简化的Servlet设计，在HTML标签中嵌套Java代码，用以高效开发Web应用的动态网页JSP 全名为 Java Server Pages，中文名叫 java 服务器页面，其根本是一个简化的 Servlet 设计，它是由Sun Microsystems 公司 倡导、许多公司参与一起建立的一种动态网页技术标准。JSP 技术是在传统的静态网页 HTML文件中插入 Java 代码片断和 JSP 标签后形成的一种文件，其后缀名为.jsp。使用JSP 开发的Web应用是跨平台的，既能在 Linux 上运行，也能在其他操作系统上运行。
JSP和Servlet的区别
JSP：HTML中直接编写Java代码
Servlet：需要继承HttpServlet
Vue
Vue (类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架。 与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用(SPA)提供驱动。
Vue和JSP的区别
JSP 是一种服务端技术，它可以在服务器端生成动态网页，并且是使用 Java 代码与 HTML 结合来实现的。而 Vue.js 是一种客户端技术，可以直接嵌入到 HTML 中，利用 Vue.js 的组件、指令等特性，可以在网页上实现很多复杂的交互功能。JSP 是一种基于模板的技术，开发人员需要在模板上添加代码，通过参数传递来实现数据的动态渲染，较为繁琐。Vue.js 直接利用数据绑定技术来实现数据的展示和更新，简洁明了，也提高了代码的可读性和可维护性。
JSP案例
1、创建web项目
2、在src文件下创建包和java文件
3、在Brand文件下编写构造函数
4、编写四种构造函数（空白处右击-Source）
5、创建JSP文件（接受并展示数据）
6、在src文件下创建包和servlet文件
7、创建数据并共享数据
8、添加到服务器
9、启动服务器（右击，启动）
10、打开谷歌浏览器，在地址栏中输入访问路径：localhost:8080/项目名称/访问路径（例如：http://localhost:8080/web-4/BrandServlet（8080为默认端口））
以上是JSP案例
完整代码展示
构造函数
package cn.lexed.pojo;
public class Brand {
private Integer id;//id主键
private String brandName;//品牌名
private String companyName;//企业名
private Integer ordered;//排序字段
private String description;//描述信息
private Integer status;//状态 0:禁用 1:启用
public Brand() {
super();
// TODO Auto-generated constructor stub
}
public Brand(Integer id, String brandName, String companyName, Integer ordered, String description,
Integer status) {
super();
this.id = id;
this.brandName = brandName;
this.companyName = companyName;
this.ordered = ordered;
this.description = description;
this.status = status;
}
public Integer getId() {
return id;
}
public void setId(Integer id) {
this.id = id;
}
public String getBrandName() {
return brandName;
}
public void setBrandName(String brandName) {
this.brandName = brandName;
}
public String getCompanyName() {
return companyName;
}
public void setCompanyName(String companyName) {
this.companyName = companyName;
}
public Integer getOrdered() {
return ordered;
}
public void setOrdered(Integer ordered) {
this.ordered = ordered;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
public Integer getStatus() {
return status;
}
public void setStatus(Integer status) {
this.status = status;
}
@Override
public String toString() {
return "Brand [id=" + id + ", brandName=" + brandName + ", companyName=" + companyName + ", ordered=" + ordered
+ ", description=" + description + ", status=" + status + "]";
}
}
JSP文件
<%@page import="cn.lexed.pojo.Brand"%>
<%@page import="java.util.List"%>
<%@ 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>
<!-- 接受数据 -->
<%
List<Brand> brands=(List<Brand>)request.getAttribute("bs");
%>
<!-- 数据展示 -->
<table>
<tr>
<td>序号</td>
<td>品牌名称</td>
<td>企业名称</td>
<td>排序</td>
<td>品牌介绍</td>
<td>状态</td>
<td>操作</td>
</tr>
<%
for(int i=0;i<brands.size();i++){
Brand brand=brands.get(i);
%>
<tr>
<td><%=brand.getId() %></td>
<td><%=brand.getBrandName() %></td>
<td><%=brand.getCompanyName() %></td>
<td><%=brand.getOrdered() %></td>
<td><%=brand.getDescription() %></td>
<td><%=brand.getStatus() %></td>
</tr>
<%
}
%>
</table>
</body>
</html>Servlet文件
package cn.lexed.servlet;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import cn.lexed.pojo.Brand;
@WebServlet("/BrandServlet")
public class BrandServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
List<Brand> brands=new ArrayList<Brand>();
Brand b1=new Brand(1,"三只松鼠","三只松鼠公司",100,"好吃不上火",1);
Brand b2=new Brand(2,"华为","华为科技有限公司",200,"真棒",0);
Brand b3=new Brand(3,"小米","小米科技公司",300,"ok",1);
brands.add(b1);
brands.add(b2);
brands.add(b3);
//把集合存到reques域里（共享数据）
request.setAttribute("bs", brands);
//资源跳转
request.getRequestDispatcher("/index.jsp").forward(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}