Web基础回顾
前端
html: 网页
超文本标记语言
作用: 在浏览器上展示数据信息
<a href="请求路径?参数名=值&参数名称=值">超链接</a>
<form action="请求路径" method="get默认|post">
<input type="text|password|radio|checkbox" />
<input type="buuton|reset|submit|image" src="图片路径" />
<input type="hidden|file|date|email" />
<select>
<option>上海</option>
<option>北京</option>
</select>
<textarea>文本域</textarea>
</form>
<img src="图片路径" alt="当路径错误时显示的提示信息" />
<table>
<tr>
<th>表头单元格</th>
<td>普通单元格</td>
</tr>
</table>
h1 - h6
p
b strong
i
ol li
ul liJavaScript:动态效果
作用: 给页面添加动态效果
历史: 95年左右,当时java语言非常火
网页: html + css
展示: 需要依赖浏览器
微软: 系统 + IE
JScript
网景公司: 网景导航者 ---> 火狐浏览器
干掉IE,要成功主流的浏览器
为了提高用户的体验度(让页面动起来)
让页面动起来 ---> 仿造java语言开发了一门新的编程语言(liveScript) ---> 这么语言翻译即可执行,用于翻译liveScript的工具已经内置到网景导航者中
ECMA组织:
ECMAScript: 核心
BOM
DOM
-------------------------
脚本语言: 需要嵌套在其他语言中使用,不能单独使用
JavaScript: 直接翻译即可,用于翻译js代码的工具叫做js引擎,js引擎已经被所有的浏览器内置了.
================================
JavaScript的工作机制: 事件驱动机制
当用户在网页上做具体的某一件事情时,才会触发事件并调用函数进行处理.
组成:
ECMAScript: js核心语法
变量声明:
var 变量名称 = 初始值;
var关键字可以省去不写,如果省去不写,则该变量为全局变量
数据类型:
原始类型: 5种
Number String Boolean Null Undefined
var str; // str的数据类型为Undefined
var str = "itheima"; //String
var str = 123; //Number
判断对象的所属类型: typeof 变量名称
引用类型:
Array: 数组
数组长度可变,类型任意
Date: 日期
Math: 数学函数
事件:
onclick: 单击事件
onsubmit: 表单提交事件
onchange: 改变事件
onload: 页面加载事件
onfocus: 获得焦点事件
onblur: 失去焦点事件
运算符:
+ - * / %
+ : 字符串拼接 数值运算
var i = "10"; var j = 3;
alert(i+j); // 103
// == != 判断值是否相等
// === !== 判断值和数据类型是否一致
// 如果2个number比较,直接比较即可
// 如果1个number和1个String类型的数字比较时,现将String转成Number再进行比较
// 如果2个String比较.比较的是ASCII的值
// 如果1个Number和一个纯字符串,永远无法比较,返回值false;
----- && || !
// js中逻辑运算符,运行结果为决定结果的那个对象本身
// js中逻辑运算符两边可以为任意对象
// alert(true&&false); //false(运算结果由第二个值决定)
// alert(false&&true); //false(运算结果由第一个值决定)
// alert(false&&false);//false(运算结果由第一个值决定)
// alert(true&&true); //true(运算结果由第二个值决定)
// 现将对象转成boolean,再进行逻辑运算,运算结果为对象本身
// "abc" --> true 0 --> false
// alert("abc"&&0); // 0
// alert("abc"&&123); // 123
// alert(null&&123); // 123
// 对象转boolean操作
// 非空对象,非0数字,非空字符串为true,其他为false
语句:
if(){}else if(){}
for(var i=0;i<10;i++){}
函数: 实现了指定功能的代码片段
普通函数:
函数名称(参数列表); //调用函数
function 函数名称(参数列表){
函数体
return 返回值;
}
匿名函数:
var 函数名称 = function(参数列表){
函数体
return 返回值;
}
匿名函数的调用,必须在定义之后
函数名称(参数);
事件:
事件和事件源绑定:
事件源: 页面上的标签
绑定事件:
<XXX 事件名称="函数名()"></XXX>
派发事件:
//1.获取事件源对象
var obj = document.getElementById("id");
//2.派发事件
obj.事件名称 = function(){
}
BOM: 浏览器对象模型
作用: 操作和控制浏览器
window: 窗口对象
消息框:
alert() : 警告框
confirm() : 确认框
prompt() : 对话框
定时器:
// 周期执行定时器
var interid
= setInterval(函数名,毫秒值); // 每隔多少毫秒调用一次指定函数
clearInterval(interid);
// 单次指定定时器
// 指定毫秒后,指定指定函数
var timeId = setTimeout("函数名()",毫秒值);
clearTimeout(timeId);
history: 历史对象
history.go(-1);
location: 连接对象 ★
location.href="路径";// 跳转到指定路径
location.href; // 获取当前页面的完整路径
DOM: 文档对象模型
作用: 操作和控制页面
DOM: 当一个网页加载到内存中时,就会形成一个DOM对象,DOM对象包含了当前页面上的所有标签.
概念:
html中的内容 DOM树中
根标签 根节点
标签 元素节点
属性 属性节点
文本 文本节点
获取元素对象: 获取标签对象
var obj = document.getElementById("id");
var obj数组 = document.getElementsByTagName("标签名");
var obj数组 = document.getElementsByName("name属性的值");
var obj数组 = document.getElementsByClassName("class属性的值");
操作标签上的属性:
获取属性值: 标签对象.属性名;
设置属性值: 标签对象.属性名 = 值;
操作标签体:
获取标签体的内容:
标签对象.innerHTM; // 获取标签体的所有内容,包含子标签
标签对象.innerText; // 获取标签的所有文本内容,不包含子标签
设置标签体内容:
标签对象.innerHTML = 值; // 设置子标签
标签对象.innerText = 值; // 设置的所有内容充当文本
操作css样式:
获取css样式:
标签对象.style.css属性;
设置css样式:
标签对象.style.css属性名 = 值;web三大组件
Servlet: /demo1Servlet
接收浏览器请求: 请求路径与Servlet绑定路径保持一致
处理业务逻辑: 调用service处理业务逻辑
生成响应: 返回浏览器执行结果
同步响应:
请求转发
重定向
异步响应:
response.getWriter().print(...);
Filter: 过滤器
过滤请求和响应信息,主要过滤请求信息
Listener: 监听器
作用: 监听javaWEB的三大作用域
ServletContextListener: 监听上下文对象的创建和销毁
通过监听上下文对象的创建和销毁,就可以间接得知服务器的启动和关闭,我们可以在服务器启动时,加载框架的配置文件,完成项目的初始化工作
生成周期相关: 监听对象的创建和销毁
HttpRequestListener
HttpSessionListener
ServletContextListener
域对象中属性的变化:
HttpRequestAttributeListener
HttpSessionAttributeListener
ServletContextAttributeListener
javaBean与Session的绑定与解绑:
三大作用域
HttpRequest: 请求信息域对象
请求来的时候,浏览器会根据HTTP协议,携带很多请求信息,Tomcat服务器接到请求后,立即解析请求信息,并创建Request对象,将解析到的数据存放到Request对象中.
作用: 存放本次请求携带的所有数据信息
生命周期:
创建: 请求来的时候
销毁: 响应生成的时候
作用范围: 本次请求
HttpSession: 会话域对象
HTTP协议是一个无状态的协议: 永远只能记住本次请求的数据信息
Session: 在多次请求之间共享数据信息
生命周期:
创建:
请求没有携带JSESSIONID,并调用request.getSession();
请求携带了JSESSIONID,但没有找到对应的session空间.
销毁:
session超时: 默认存活30分钟
手动销毁: session.invalidate();
非正常关机
作用范围:
本次会话
API:
request.getSession();
创建session空间,并返回JSESSIONID
根据JSESSIONID找到对应的session空间
ServletContext:
一个项目有且仅有一个ServletContext
生命周期:
创建: 服务器启动时
销毁: 服务器关闭时
作用范围: 当前项目
与项目共存亡
