01-HTML和CSS
表单标签:表单就是 html 页面中,用来收集用户信息的所有元素集合.然后把这些信息发送给服务器。
<form action="http://localhost:8080" method="post"></form>
form 标签是表单标签
action 属性设置提交的服务器地址
method 属性设置提交的方式 GET(默认值)或 POST
表单提交的时候,数据没有发送给服务器的三种情况:
1、表单项没有 name 属性值
2、单选、复选(下拉列表中的 option 标签)都需要添加 value 属性,以便发送给服务器
3、表单项不在提交的 form 标签中
GET 请求的特点是:
1、浏览器地址栏中的地址是:action 属性[+?+请求参数]
请求参数的格式是:name=value&name=value
2、不安全
3、它有数据长度的限制
POST 请求的特点是:
1、浏览器地址栏中只有 action 属性值
2、相对于 GET 请求要安全
3、理论上没有数据长度的限制
css引入方式
1、<style type = "text/css"> </style>
2、<link rek="stylesheet" type="text/css" href="link--"/>
语法规则:
02-JavaScript
引入javascript方式:
1、<script type="text/javascript></script>
2、<script type="text/javascript" scr=""></script>
变量
变量类型: | 特殊值: |
---|---|
number string object boolean function | undefined null NaN |
数组:
var 数组名 = [];
var 数组名 = [1,2,3];
函数:
function fun(arg1,arg2){ }
var fun = function(arg1,arg2){ }
自定义对象:
对象的定义:
var 变量名 = new Object(); // 对象实例(空对象)
变量名.属性名 = 值; // 定义一个属性
变量名.函数名 = function(){} // 定义一个函数
对象的访问:
变量名.属性 / 函数名();
js中的事件:
onclick onload onblur onchange onsubmit
事件的绑定:
静态注册事件:
通过 html 标签的事件属性直接赋于事件响应后的代码,这种方式我们叫静态注册。
动态注册事件:
是指先通过 js 代码得到标签的 dom 对象,然后再通过 dom 对象.事件名 = function(){} 这种形式赋于事件响应后的代码,叫动态注册。
DOM:
dom对象常用方法:
document.getElementById(elementId)
document.getElementsByName(elementName)
document.getElementsByTagName(tagname)
document.createElement( tagName)
节点的常用属性和方法:
节点就是标签对象
methods or attrs | descreption |
---|---|
getElementsByTagName() | 方法,获取当前节点的指定标签名孩子节点 |
appendChild( oChildNode) | 方法,可以添加一个子节点,oChildNode |
childNodes | 属性,获取当前节点的所有子节点 |
firstChild | 属性,获取当前节点的第一个子节点 |
lastChild | 属性,获取当前节点的最后一个子节点 |
parentNode | 属性,获取当前节点的父节点 |
nextSibling | 属性,获取当前节点的下一个节点 |
previousSibling | 属性,获取当前节点的上一个节点 |
className | 用于获取或设置标签的 class 属性值 |
innerHTML | 属性,表示获取/设置起始标签和结束标签中的内容 |
innerText | 属性,表示获取/设置起始标签和结束标签中的文本 |
03-JQuery
$是 jQuery 的核心函数,能完成 jQuery 的很多功能。$()就是调用$这个函数
1、传入参数为 [ 函数 ] 时: | 表示页面加载完成之后。相当于 window.onload = function(){} |
---|---|
2、传入参数为 [ HTML 字符串 ] 时: | 会对我们创建这个 html 标签对象 |
3、传入参数为 [ 选择器字符串 ] 时: | $(“#id 属性值”); id 选择器,根据 id 查询标签对象$(“标签名”); 标签名选择器,根据指定的标签名查询标签对象$(“.class 属性值”); 类型选择器,可以根据 class 属性查询标签对象 |
4、传入参数为 [ DOM 对象 ] 时: | 会把这个 dom 对象转换为 jQuery 对象 |
jQuery 对象是 dom 对象的数组 + jQuery 提供的一系
JQuery选择器:
1、基本选择器:
基本选择器
2、层级选择器:
层级选择器
3、基本过滤器:
基本过滤器
4、内容过滤器:
内容过滤器
5、属性过滤器:
属性过滤器
6、表单过滤器:
表单过滤器
DOM的增删改:
a.appendTo(b) | 把 a 插入到 b 子元素末尾,成为最后一个 |
---|---|
a.prependTo(b) | 把 a 插到 b 所有子元素前面,成为第一个子元素 |
a.insertAfter(b) | 得到 ba |
a.insertBefore(b) | 得到 ab |
a.replaceWith(b) | 用 b 替换掉a |
a.replaceAll(b) | 用 a 替换掉所有b |
a.remove() | 删除 a 标签 |
a.empty() | 清空 a 标签里的内 |
css样式操作:
addClass() | 添加样式 |
---|---|
removeClass() | 删除样式 |
toggleClass() | 有就删除,没有就添加样式。 |
offset() | 获取和设置元素的坐标。 |
JQuery动画
show() | 将隐藏的元素显示 |
---|---|
hide() | 将可见的元素隐藏。 |
toggle() | 可见就隐藏,不可见就显示。 |
04-Tomcat
JavaWeb 是指,所有通过 Java 语言编写可以通过浏览器访问的程序的总称,叫 JavaWeb。
JavaWeb 是基于请求和响应来开发的。
Tomcat目录介绍:
Tomcat目录介绍05-XML
xml 的主要作用有:
1、用来保存数据,而且这些数据具有自我描述性
2、它还可以做为项目或者模块的配置文件
3、还可以做为网络传输数据的格式(现在 JSON 为主)。
xml语法:
- 文档声明。
- 元素(标签)
- xml 属性
- xml 注释
html 和 XML 注释 一样 - 文本区域(CDATA 区)
CDATA 语法可以告诉 xml 解析器,我 CDATA 里的文本内容,只是纯文本,不需要 xml 语法解析
CDATA 格式:
<![CDATA[ 这里可以把你输入的字符原样显示,不会解析 xml ]]
06-Servlet
a)什么是 Servlet
1、Servlet 是 JavaEE 规范之一。规范就是接口
2、Servlet 就 JavaWeb 三大组件之一。三大组件分别是:Servlet 程序、Filter 过滤器、Listener 监听器。
3、Servlet 是运行在服务器上的一个 java 小程序,它可以接收客户端发送过来的请求,并响应数据给客户端。
b)手动实现 Servlet 程序
1、编写一个类去实现 Servlet 接口
2、实现 service 方法,处理请求,并响应数据
3、到a)什么是 Servlet
1、Servlet 是 JavaEE 规范之一。规范就是接口
2、Servlet 就 JavaWeb 三大组件之一。三大组件分别是:Servlet 程序、Filter 过滤器、Listener 监听器。
3、Servlet 是运行在服务器上的一个 java 小程序,它可以接收客户端发送过来的请求,并响应数据给客户端。 b)手动实现 Servlet 程序
1、编写一个类去实现 Servlet 接口
2、实现 service 方法,处理请求,并响应数据
3、到 web.xml中去配置servlet程序的访问地址
通过继承 HttpServlet 实现 Servlet 程序
一般在实际项目开发中,都是使用继承 HttpServlet 类的方式去实现 Servlet 程序。
1、编写一个类去继承 HttpServlet 类
2、根据业务需要重写 doGet 或 doPost 方法
3、到 web.xml 中的配置 Servlet 程序的访问地址
ServletConfig 类
1、可以获取 Servlet 程序的别名 servlet-name 的值
2、获取初始化参数 init-param
3、获取 ServletContext 对象
ServletContext 类
a)什么是ServletContext
1、ServletContext 是一个接口,它表示 Servlet 上下文对象
2、一个 web 工程,只有一个 ServletContext 对象实例。
3、ServletContext 对象是一个域对象。
4、ServletContext 是在 web 工程部署启动的时候创建。在 web 工程停止的时候销毁。
b)ServletContext 类的四个作用
1、获取 web.xml 中配置的上下文参数 context-param
2、获取当前的工程路径,格式: /工程路径
3、获取工程部署后在服务器硬盘上的绝对路径
4、像 Map一样存取数据
HTTP协议
a)请求的HTTP协议格式:
image.pngimage.png
image.png
b)响应的HTTP协议格式
image.png常用的响应码说明:
200 | 表示请求成功 |
---|---|
302 | 表示请求重定向 |
404 | 表示请求服务器已经收到了,但是你要的数据不存在(请求地址错误) |
500 | 表示服务器已经收到请求,但是服务器内部错误(代码错误) |
HttpServletRequest 类
a)HttpServletRequest 类有什么作用。
每次只要有请求进入 Tomcat 服务器,Tomcat 服务器就会把请求过来的 HTTP 协议信息解析好封装到 Request 对象中。
然后传递到 service 方法(doGet 和 doPost)中给我们使用。我们可以通过 HttpServletRequest 对象,获取到所有请求的信息.
b)HttpServletRequest 类的常用方法
i. getRequestURI() | 获取请求的资源路径 |
---|---|
ii. getRequestURL() | 获取请求的统一资源定位符(绝对路径) |
iii. getRemoteHost() | 获取客户端的 ip 地址 |
iv. getHeader() | 获取请求头 |
v. getParameter() | 获取请求的参数 |
vi. getParameterValues() | 获取请求的参数(多个值的时候使用) |
vii. getMethod() | 获取请求的方式 GET 或 POST |
viii. setAttribute(key, value); | 设置域数据 |
ix. getAttribute(key); | 获取域数据 |
x. getRequestDispatcher() | 获取请求转发对象 |
base标签的作用
base标签可以设置当前页面中所有相对路径工作时,参照那个路径来进行跳转
web 中 / 斜杠的不同意义
image.png
HttpServletResponse
a)HttpServletResponse 类的作用
HttpServletResponse 类和 HttpServletRequest 类一样。每次请求进来,Tomcat 服务器都会创建一个 Response 对象传递给 Servlet 程序去使用。HttpServletRequest 表示请求过来的信息,HttpServletResponse 表示所有响应的信息,我们如果需要设置返回给客户端的信息,都可以通过 HttpServletResponse 对象来进行设置
b)两个输出流的说明。
字节流 getOutputStream(); 常用于下载(传递二进制数据)
字符流 getWriter(); 常用于回传字符串(常用)
两个流同时只能使用一个。
使用了字节流,就不能再使用字符流,反之亦然,否则就会报错。
07-JSP
JSP(全称 Java Server Pages)是由 Sun 公司专门为了解决动态生成 HTML 文档的技术
jsp 的本质 ,其实是一个 Servlet 程序。
JSP的语法:
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
这是 jsp 文件的头声明。表示这是 jsp 页面
jsp 中的三种脚本介绍:
1)声明脚本:
<%! %>
在声明脚本块中,我们可以干 4 件事情
1.我们可以定义全局变量。
2.定义 static 静态代码块
3.定义方法
4.定义内部类
几乎可以写在类的内部写的代码,都可以通过声明脚本来实现
2)表达式脚本:
<%=表达式 %>
表达式脚本可以输出任意类型。
3)代码脚本:
<% java代码 %>
代码脚本里可以书写任意的 java 语句。
代码脚本的内容都会被翻译到 service 方法中。
所以 service 方法中可以写的 java 代码,都可以书写到代码脚本中
jsp的九大内置对象:
request 对象 | 请求对象,可以获取请求信息 |
---|---|
response 对象 | 响应对象。可以设置响应信息 |
pageContext 对象 | 当前页面上下文对象。可以在当前上下文保存属性信息 |
session 对象 | 会话对象。可以获取会话信息。 |
exception 对象 | 异常对象只有在 jsp 页面的 page 指令中设置 isErrorPage="true" 的时候才会存在 |
application 对象 | ServletContext 对象实例,可以获取整个工程的一些信息。 |
config 对象 | ServletConfig 对象实例,可以获取 Servlet 的配置信息 |
out 对象 | 输出流。 |
page 对象 | 表示当前 Servlet 对象实例(无用,用它不如使用 this 对象)。 |
jsp的常用标签:
1)静态包含--很常用
<%@ include file=" " %>
2)动态包含--很少用
<jsp: include page=""></jsp:include>
3)页面转发--常用
<jsp:forward page=""></jsp:forward>
08-EL表达式与JSTL标签库
EL 表达式主要是代替 jsp 页面中的表达式脚本在 jsp 页面中进行数据的输出。
因为 EL 表达式在输出数据的时候,要比 jsp 的表达式脚本要简洁很多
EL 表达式的格式是:\${表达式}
EL 表达式在输出 null 值的时候,输出的是空串。jsp 表达式脚本输出 null 值的时候,输出的是 null
EL 表达式的 11 个隐含对象
变量 | 类型 | 作用 |
---|---|---|
pageContext | PageContextImpl | 它可以获取 jsp 中的九大内置对象 |
pageScope | Map<String,Object> | 它可以获取 pageContext 域中的数据 |
requestScope | Map<String,Object> | 它可以获取 Request 域中的数据 |
sessionScope | Map<String,Object> | 它可以获取 Session 域中的数据 |
applicationScope | Map<String,Object> | 它可以获取 ServletContext 域中的数据 |
param | Map<String,String> | 它可以获取请求参数的值 |
paramValues | Map<String,String[]> | 它也可以获取请求参数的值,获取多个值的时候使用。 |
header | Map<String,String> | 它可以获取请求头的信息 |
headerValues | Map<String,String[]> | 它可以获取请求头的信息,它可以获取多个值的情况 |
cookie | Map<String,Cookie> | 它可以获取当前请求的 Cookie 信息 |
initParam | Map<String,String> | 它可以获取在 web.xml 中配置的<context-param>上下文参数 |
EL 表达式其他隐含对象的使用
param | Map<String,String> | 它可以获取请求参数的值 |
---|---|---|
paramValues | Map<String,String[]> | 它也可以获取请求参数的值,获取多个值的时候使用。 |
header | Map<String,String> | 它可以获取请求头的信息 |
headerValues | Map<String,String[]> | 它可以获取请求头的信息,它可以获取多个值的情况 |
cookie | Map<String,Cookie> | 它可以获取当前请求的 Cookie 信息 |
JSTL标签库
JSTL 标签库 全称是指 JSP Standard Tag Library 。
EL 表达式主要是为了替换 jsp 中的表达式脚本,而标签库则是为了替换代码脚本。这样使得整个 jsp 页面变得更佳简洁。
在 jsp 标签库中使用 taglib指令引入标签库
CORE 标签库
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
XML 标签
core 核心库使用
<c:set/> | set 标签可以往域中保存数据 |
---|---|
<c:if/> | if 标签用来做 if 判断 |
<c:choose><c:when><c:otherwise> | 多路判断。跟 switch ... case .... default 非常接近 |
<c:forEach/> | 遍历输出使用。 |
09-MVC概念
MVC 全称:Model 模型、 View 视图、 Controller 控制器。
MVC 最早出现在 JavaEE 三层中的 Web 层,它可以有效的指导 Web 层的代码如何有效分离,单独工作。
View 视图:只负责数据和界面的显示,不接受任何与显示数据无关的代码,便于程序员和美工的分工合作——JSP/HTML。
Controller 控制器:只负责接收请求,调用业务层的代码处理请求,然后派发页面,是一个“调度者”的角色——Servlet。转到某个页面。或者是重定向到某个页面。
Model 模型:将与业务逻辑相关的数据封装为具体的 JavaBean 类,其中不掺杂任何与数据处理相关的代码—JavaBean/domain/entity/pojo。
MVC 是一种思想
MVC 的理念是将软件代码拆分成为组件,单独开发,组合使用(目的还是为了降低耦合度)
10-Cookie和Session
a)什么是 Cookie?
1、Cookie 翻译过来是饼干的意思。
2、Cookie 是服务器通知客户端保存键值对的一种技术。
3、客户端有了 Cookie 后,每次请求都发送给服务器。
4、每个 Cookie 的大小不能超过4kb
b)如何创建Cookie?
new Cookie("key","value");
c)服务器如何获取 Cookie
服务器获取客户端的 Cookie 只需要一行代码:req.getCookies():Cookie[]
d)Cookie 值的修改
方案一:
1、先创建一个要修改的同名(指的就是 key)的 Cookie 对象
2、在构造器,同时赋于新的 Cookie 值。
3、调用 response.addCookie( Cookie )
方案二:
1、先查找到需要修改的 Cookie 对象
2、调用 setValue()方法赋于新的 Cookie 值。
3、调用 response.addCookie()通知客户端保存修改
f) Cookie 生命控制
Cookie 的生命控制指的是如何管理 Cookie 什么时候被销毁(删除)
setMaxAge()
正数,表示在指定的秒数后过期
负数,表示浏览器一关,Cookie 就会被删除(默认值是-1)
零,表示马上删除 Cookie
g)Cookie 有效路径 Path 的设置
Cookie 的 path 属性可以有效的过滤哪些 Cookie 可以发送给服务器。哪些不发。
path 属性是通过请求的地址来进行有效的过滤
Session
1) 什么是 Session 会话?
1、Session 就一个接口(HttpSession)。
2、Session 就是会话。它是用来维护一个客户端和服务器之间关联的一种技术。
3、每个客户端都有自己的一个 Session 会话。
4、Session 会话中,我们经常用来保存用户登录之后的信息.
2) 如何创建 Session 和获取(id 号,是否为新)
如何创建和获取 Session。它们的 API 是一样的。
request.getSession()
第一次调用是:创建 Session 会话
之后调用都是:获取前面创建好的 Session 会话对象。
isNew(); 判断到底是不是刚创建出来的(新的)
true 表示刚创建 false 表示获取之前创建
每个会话都有一个身份证号。也就是 ID 值。而且这个 ID 是唯一的。
getId() 得到 Session 的会话 id
3)浏览器和 Session 之间关联的技术内幕
Session 技术,底层其实是基于 Cookie 技术来实现的。
11-Filter过滤器
1、Filter 过滤器它是 JavaWeb 的三大组件之一。三大组件分别是:Servlet 程序、Listener 监听器、Filter 过滤器
2、Filter 过滤器它是 JavaEE 的规范。也就是接口
3、Filter 过滤器它的作用是:拦截请求,过滤响应。
Filter 过滤器的使用步骤:
1、编写一个类去实现 Filter 接口
2、实现过滤方法 doFilter()
3、到 web.xml 中去配置 Filter 的拦截路径
FilterChain 过滤器
在多个Filter过滤器执行的时候,优先顺序是在web.xml中从上到下配置的顺序决定
Filter 的拦截路径
精确匹配 | <url-pattern>/target.jsp</url-pattern> |
---|---|
目录匹配 | <url-pattern>/admin/*</url-pattern> |
后缀名匹配 | <url-pattern>*.jsp</url-pattern> |
ThreadLocal 的使用:
ThreadLocal 的作用,它可以解决多线程的数据安全问题。
ThreadLocal 它可以给当前线程关联一个数据(可以是普通变量,可以是对象,也可以是数组,集合)
ThreadLocal 的特点:
1、ThreadLocal 可以为当前线程关联一个数据。(它可以像 Map 一样存取数据,key 为当前线程)
2、每一个 ThreadLocal 对象,只能为当前线程关联一个数据,如果要为当前线程关联多个数据,就需要使用多个
ThreadLocal 对象实例。
3、每个 ThreadLocal 对象实例定义的时候,一般都是 static 类型
4、ThreadLocal 中保存数据,在线程销毁后。会由 JVM 虚拟自动释放。
12-JSON、AJAX
JSON
JSON (JavaScript Object Notation) 是一种轻量级的数据交换格式。
json 定义示例:
var jsonObj = {
"key1":12,
"key2":"abc",
"key3":true,
"key4":[11,"arr",false],
"key5":{
"key5_1" : 551,
"key5_2" : "key5_2_value"
},
"key6":[{
"key6_1_1":6611,
"key6_1_2":"key6_1_2_value"
},{
"key6_2_1":6621,
"key6_2_2":"key6_2_2_value"
}]
};
json 的访问
json 本身是一个对象。
json 中的 key 我们可以理解为是对象中的一个属性。
json 中的 key 访问就跟访问对象的属性一样: json 对象.key
json 的两个常用方法
JSON.stringify() | 把 json 对象转换成为 json 字符串 |
---|---|
JSON.parse() | 把 json 字符串转换成为 json 对象 |
javaBean 和 json 的互转
String personJsonString = gson.toJson(person);
Person person1 = gson.fromJson(personJsonString, Person.class)
map 和 json 的互转
Map<Integer,Person> personMap = new HashMap<>();
String personMapJsonString = gson.toJson(personMap);
Map<Integer,Person> personMap2 = gson.fromJson(personMapJsonString, new
TypeToken<HashMap<Integer,Person>>(){}.getType());
AJAX
AJAX 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术
jQuery 中的 AJAX 请求
$.ajax 方法
url | 表示请求的地址 |
---|---|
type | 表示请求的类型 GET 或 POST 请求 |
data | 表示发送给服务器的数据 格式有两种 一:name=value&name=value 二:{key:value} |
success | 请求成功,响应的回调函数 |
dataType | 响应的数据类型 常用的数据类型有:text 表示纯文本 xml 表示 xml 数据 json 表示 json 对象 |
$.get 方法$.post 方法
url | 请求的 url 地址 |
---|---|
data | 发送的数据 |
callback | 成功的回调函数 |
type | 返回的数据类型 |
$.getJSON 方法
url | 请求的 url 地址 |
---|---|
data | 发送给服务器的数据 |
callback | 成功的回调函数 |
表单序列化 serialize()
serialize()可以把表单中所有表单项的内容都获取到,并以 name=value&name=value 的形式进行拼接。
网友评论