JavaWeb基础

Day 01

Html

1.Html概念:

HTML==> hyper text mark-up language==>超文本标记语言
超文本: 1.表达能力优于普通文本.声音 .图形等..
        2.超链接
标记语言:标记构成的.(HTML XML XHTML)

HTML是干什么的? 
    1.网页.
    2.展示.
HTML是由谁来解析?
    浏览器来负责解析HTML.
HTML文档的后缀名?
    .html
    .htm
    以上两种后缀名没有区别.
文档构成:
    HTML文档.
    最外层使用<HTML>标签包裹
            <HEAD> 头 ==> 标题.网页属性信息,CSS..
            <BODY> 体 ==> 正文.
标签写法:
    1.<>中包裹一个英文单词
    2.所有标签不区分大小写(推荐使用小写)
    3.标签分为两类
        1>围堵标记=> 有开始标签 有结束标签
        2>自闭合标签 => 例如 <br/>
    注意:所有标记语言,标签中的英文单词没有以数字开头的.<>


    注意:HTML中不支持 : 空格 回车 制表符.都会被解析成一个空白字符.

2.解决乱码,告诉浏览器 当前文档类型和编码

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

3.标题标签 ==> n的取值范围是1~6;

1.1~6从大到小.
2.文字加粗
3.换行

4.字体标签: 该标签的使用必须配合属性.

size:大小. 取值1~7之间 从小到大.
face:字体.
color:颜色
    1.直接填写颜色的英文名称
    2.#FF0000
    3.rgb(255,0,0)

5.其他一些简单标签:

<strike> => 中划线.
<big> => 变大
<small> => 变小
<u> =>  下划线
<b> => 
sub /sup => 上下角标.
&nbsp; ==> 空格
&gt;/&lt; ==> 大于号 / 小于号

6.ol有序列表: order list

type属性: 取值 A a I i 1(默认值)   
start属性: 从几开始计数
<li>

7.ul无序列表: unorder list

type属性:disc  (默认)
        square  方形
        circle  圆形
<li>

8.分类列表:

dl : definition list
dt : definition title
dd : definition description

9.img图形标签

src属性: 指定图片位置
alt属性: 当图片无法加载时显示的提示信息.
title属性: 鼠标悬浮时显示提示信息
heigth属性: 图片的高(单位是像素) (如果宽和高只指定一个,图片会按比例缩放.)
width属性:图片的宽.
border属性: 边框(单位是像素)
usemap属性: 将图片分区,每个区点了之后连接到不同的页面.dw=> 

10.a标签: anchor锚

1.超链接 -> 点击之后跳转页面
    格式: 协议名+资源 
         http://www.baidu.com(我们常用的) 
         mailto : [email protected] 发送邮件
         thunder:  迅雷下载
         QQ:
         旺旺:
2.锚 => 在当前页面中跳转例如:回到顶部 ==> 使用就是锚.
    1>做一个锚标记,使用a标签的name属性指定锚点名称. <a name="abc" >这是顶部</a>
    2>跳转到锚标记,使用href属性指定要跳转到的锚点.<a href="#abc" >回到顶部</a>

11.a标签中的属性

href属性: 跳转的资源名 或 锚点名称
name属性: 定义锚点时,指定锚点名称.
target属性: 针对资源跳转时使用.
    该属性不指定==> 在当前页面打开.
    _blank : 在空白页打开. 

12. 表格:

cellspacing: 外边距 => 单元格和其他单元格(边框)之间的距离
cellpadding: 内边距 => 内容和单元格框线之间的距离
    <tr>:table row 表格中的一行
        <td>:table data cell 一行中的一个单元格
        <th>:table header 标题单元格
            colspan属性: 横着占多少列
            rowspan属性: 竖着占多少行
            align属性:对齐

13.form表单标签: 要提交的内容,使用该标签包裹

action属性: 决定表单提交到哪里             
method属性: 决定表单的提交方式  get(默认值)/post
    post和get区别:
        1.post提交(http 请求正文中) 键值对没有在地址栏上.而get是放在地址栏上的.
        2.安全性上post更高一些.
        3.长度上:get因为是放到地址栏中,长度受限.2k. post 理论上是无限的. 

input标签: 表单项标签
    type类型:
        text 文本框
        password 密码框
        radio 单选框
        checkbox 多选框
        file 文件上传
        hidden 隐藏域
        submit 提交
        reset 重置
        image 提交(图片,没用了)
        button 按钮
    name属性:
        对于表单项: 提交时键值对的键
    value属性:
        1>对于需要提交的表单项: 提交时的值
        2>按钮类型的: 按钮上显示的文字.
    readonly属性:
            只读属性.只是限制value属性的变化.
            只能给: text 和 password 使用. textarea也有这个属性.
    disabled属性:
            禁用.颜色变灰. 不参与提交.
            适用范围,所有input都可以使用.
    checked属性:
            默认被选中.
            只适用于: 1 radio  2 checkbox
    maxlength属性:定义最大长度.
    size 属性: 定义输入框的显示长度.
        以上两个属性 只能放在 text 和 password中.

    select 标签:
            下拉选         
        name属性: 提交的键
        size属性: 同时显示的选项个数
        multiple属性: 变成多选
        selected属性: 让option默认被选中.
    textarea 标签: 
            文本域
        name属性: 提交的键
        col属性: 列 宽
        row属性:   行高
        readonly属性:只读.          

14.meta标签 :属性标签 . 网页元标签

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="refresh" content="3;url=06-图形标签.html">
//--------------------------------------------------
<meta name=“keywords” content=“传智播客,IT培训" />
<meta name="description" content="传智播客是国内最大的……" />

CSS

CSS

cascade style sheet 层叠样式表

1.概念

决定页面的样式.
1>.配色
2>.布局

2.CSS与 HTML的结合方式

1> style属性

    在标签上加入style属性.
    属性的值就是css代码.
    <p style="color:red;" >itcast传智播客</p>

2> style标签

    在页面的head标签中, 书写一个style标签.
    在style标签中书写css代码.
    <style type="text/css">
        p {
            color:blue;
        }
    </style>

3> link标签引入

    在页面head标签中填写link标签
    <link type="text/css" rel="stylesheet" href="p.css" />
    type mime类型
    rel  类型
    href css文件路径    

3.CSS的 选择器

1>标签选择器

    语法:  
        标签名 {
            属性键:属性值;
        }

2>ID选择器

    ID属性唯一标识符.
        要确保页面当中id属性的唯一性.
    ID选择器:
        语法:  
        #ID {
            属性键:属性值;
        }

3>class选择器

    class属性可以随意重复.

    CLASS选择器:
        语法: 
         .CLASS名称 {
            属性键:属性值;
        }

4>选择器分组

    语法:  
    选择器1,选择器2...... {
        属性键:属性值;
    }

    eg:
    <style type="text/css">
        .one,#two {
            color:yellow;
        }

    </style>

5>伪类选择器

    指的是选择的某个标签的 某种状态
    常见状态有4种,a标签最全.
        l link  没有点击 过的状态
        v visited  访问过
        h hover  鼠标悬浮
        a active  激活状态(鼠标点下去没有弹起)

    Eg:
    <a href="01-结合方式01.html" >01-结合方式01.html</a>
    <style type="text/css">
        a:link {
            color:red;
        }
        a:visited {
            color:green;
        }
        a:hover {
            color:blue;
        }
        a:active {
            color:yellow;
        }
    </style>

4.CSS的基本语法

选择器 {
    属性键:属性值;
    属性键:属性值1 属性值2 ....;

}
注释:与java中多行注释相同
    /* 注释内容 */

1>eg:
    <p>itcast传智播客</p>

    <style type="text/css">
        p {
        /*
            font-size: 100px;
            font-family: 黑体;
            font-style: italic;
            font-weight: 900;
            font-variant: small-caps;
        */
        font :italic small-caps 900 100px 黑体;

        }
    </style>

2>eg:
    <style type="text/css">
        body {
        /*
            background-color: pink;
            background-image: url("001.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed;
            */
            background : green url("001.jpg") no-repeat fixed center; 

        }
    </style>

5.CSS的常用属性

单位:(了解)
    颜色单位 Color Units 
        #RRGGBB    rgb ( R,G,B )    Color Name 
    长度单位 Length Units 
        em    ex    px像素(常用)    pt    pc    in    cm    mm 
    单位换算:1in = 2.54cm = 25.4 mm = 72pt = 6pc 
属性:
    color ==> 文字颜色
    font-family ==> 文字样式
    font-size ==> 文字大小
    font-style => 文字样式(斜体..)
    font-weight => 文字加粗
    font-variant => 异性字

6.盒子模型

块级标签: 占的是一行.
行内标签: 占行内的一部分. 不能嵌套 块级标签.

块级: div p ol 
行内: span font a 

<body>
    <div id="one" >
        <div id="two" >
        </div>
    </div>
</body>

eg:
<style type="text/css">
    div{
        border-color: red;
        border-width: 1px;
        border-style: solid;
    }
    #one{
        width: 200px;
        height: 300px;
        /*
            内边距:
                注意,内边距会改变自身的宽高.

        */
        padding-left: 100px;
    }
    #two{
    width: 100px;
    height: 100px;
    /*
    外边距
    margin-left: 100px;
    */
    }
</style>

eg2:

<style type="text/css">
    div{
    /*
        border-color: red;
        border-width: 1px;
        border-style: solid;
        */
        border: 1px solid red;

        width: 100px;
        height: 100px;
    }
    #one{
        /*
            1个属性时: 4个方向.
            2个属性时: 第一个属性决定上下 第2个决定左右
            3个属性时: 上   左右  下
            4个属性时: 上 右 下 左(顺时针)
        */
        padding: 10px 30px 50px 80px;
    }
</style>


eg3:透明

<style type="text/css">
    div{
        border: 1px solid red;


    }
    #one{
        background-color:black;
        width: 300px;
        height: 300px;
    }
    #two{
        background-color:white;
        width: 100px;
        height: 100px;
        opacity:0.7;
    }
</style>

eg4:隐藏
<body>
    itcast传智播客<div>itcast传智播客</div>itcast传智播客 <br>
    itcast传智播客<span>itcast传智播客</span>itcast传智播客
</body>

<style type="text/css">
    div {
        display: none;
    }
    span {
        /*
            display : 调整标签类型
                block
                inline
                none 不显示,而不留位置

            display: none;
        */
        visibility: hidden;
    }
</style>

7.表格内外边距


Day 02

JS(java)

JS基础

1.JS的历史

js是面向对象的语言.
    1.封装
    2.继承
    3.多态
    4.聚集 -> 对象中具有引用其他对象的能力.
js使用中绝大多数情况不需要进行面向对象的设计.跟多情况是使用已经设计好准备好的对象.

基于对象的语言.

2.JS的引入

1>页面中直接在script标签中书写

    <script type="text/javascript">
        alert('aaa');
    </script>
2>在script标签中引入
注意:
    1>script标签位置任意. 但是 位置越靠前,执行越早.(重要,记住)
    2>js外部文件推荐扩展名是.js.但是其实任何后缀名都可以.
    3>使用script标签引入外部文件,那么该script标签中就不要书写js代码了.

        <script type="text/javascript" src="hello.js" >

3.JS的基本语法

1> 变量声明
    var num = 10;
    var str = 'haha';//"haha" 没有区别
    //变量声明使用var
    //变量区分大小写  str 和 STR 不是同一个变量
    //字符串使用  双引号 或 单引号包裹 都可以.
    //变量的类型可以随时改变.
    //命名规则==>匈牙利标记法
2> 行尾使用";" 作为一行的结束符号.(可以没有";",以折行符(回车)作为一行的结尾.)(不推荐)
    var num2 = 20
3> js中的注释有两种 单行,多行
    // 单行注释"//"
    // 多行注释 "/* */"
    // 没有文档注释
4> 封装代码块 与 java一样,使用{}.
5> 变量声明时,前缀var 也不是必须的.
     //加var 和 不加 var 有什么区别?
     // 如果不使用var,那么该变量是全局变量

4.JS的类型

1>java ==> 基本数据类型 和 引用数据类型.
2>js中 类型也分为两种 ==>  原始数据类型 和 对象数据类型. 与java一模一样.
3>java中 基本数据类型有哪些? byte short int long  float double boolean char
4>js中 原始数据类型有哪些? 
    number(数字,浮点型,整型) java中的浮点型和整型6种 在js中都是number
    string(js语言的突破,没有char类型.)java中的字符串和字符在js中都是string
    boolean
    null  (用来标示引用数据类型的占位符.通常都是人为赋值.)var person = null;
    undefined  (由null衍生出来的值,是当我们声明一个变量,) 
        //1.没有给该变量初始化值,那么系统会默认赋值为undefined
        //2.函数中没有返回值,那么默认返回undefined
    原始数据类型 判断符:
        typeof ==> 用来判断一个变量是哪种原始类型的.
        //为什么null返回object?
            //是js中的一个bug,这个bug 被认为很贴切.所以保留了该bug.

5.JS中的语句

1>java中有哪些语句?
    //循环: for while-do  do-while
    //判断: if switch
2>js中语句 与java中一模一样!
    //特殊: java中的增强for循环在js中没有.
    //      js中有for(var xxx in xxx) 语句. ==> 用的很少,用来遍历对象的属性.

6.JS中运算符

1>一元运算符
    void==>放到后面,学完函数讲
2>一元加法,减法
    var a = +1;
    var b = -1;
    在js中的高级应用.
    var c = +"1";  //这样写是在进行类型转换
    var d = +"abc"; // 这样写会转换失败,返回number中的特殊值 NaN.
3>Boolean 运算符 ! && ||
    js中自动类型转换.
            //转换规律 (重点)
            //string ==>  ""==>转换为false 其他都为true;
            //number ==>  除了NaN,+0和-0.其他都转换为true.
            //null ==>  false
            //undefined ==> false
            //"+" ==> 可用于将字符串转换为数字,如果含有不能转化的字符,返回NaN.
    //NaN特性:
        //NaN参与的任何boolean运算返回值都是false. 除了!=
    //因为undefined是null衍生出的,所以 
        alert(undefined == null);// true
4>比较运算符
        alert(11>3);//true
        //当运算符两端 , 一端是数字,一端是其他类型时, 其他类型会自动向数字类型转换
        alert("11">3);// true
        alert(11>"3");//true
        //字符串在进行比较时 ,规律是: 比较首字符asc码. 如果一样,比较第2位...
        alert("11">"3");// false
        alert("11">"1");// true
        alert("abc">11);//false
5>等性运算符  == != ===
    全等于: === ==> 比较时包括类型.

    等性表
        null == undefined      true
        false == 0              true
        true == 1               true
        2 == true               false
        NaN == NaN              false
        NaN == 'NaN'            false
        NaN != NaN              true

7.ECMAScript中的对象

1.Object ==> 知道他是所有对象的超类. 
2.Function对象
      1> Function的创建
         方式1:var fun1 = new Function("a","b","alert(a+b);"); //函数对象的构造方法中,最后一个参数是定义函数的体.之前所有参数都是定义函数的参数
         方式2:var fun2 = function (a,b){alert(a+b);}
         方式3:function fun3(a,b){alert(a+b)}
      2>Function的调用 ==> js中函数的调用只看函数名称.
        调用时内置对象arguments
                arguments代表 函数运行期间实际参数列表.
                arguments.length ==> 实际参数个数
                arguments[0] ==> 第一个参数.

        eg:
                function fun1(a,b){
                alert(a+b);
                }
                fun1(1,2);//3
                fun1(1,2,3);//3
                fun1();//NaN 

    ------------------------------------

                function fun2(){
                    //alert(arguments.length); //取得实际参数个数
                    alert(arguments[0]); // 获得第一个实际参数
                }
                //函数中的内置对象 arguments
                //arguments ==> 代表函数运行时的实际参数列表.
                fun2(); //0  undefined
                fun2(1,2); //2 1
                fun2(1,2,3); //3 1

    ------------------------------------

                function fun3(){
                    alert('aaa');
                }
                function fun3(a){
                    alert('bbb');
                }
            //如上不能重载,是覆盖

    ------------------------------------

                function fun4(){
                    if(arguments.length == 2){
                        alert(arguments[0]+arguments[1]);
                    }else if(arguments.length == 3){
                        alert(arguments[0]+arguments[1]-arguments[2]);
                    }

                }


                fun4(1,2);//3
                fun4(1,2,3);//0

                //以上是重载.

        应用: arguments 实现函数的重载.
      3> 函数的返回
        1>如果函数没有显示指定返回值 那么函数返回值为undefined.

            function fun1(){}
            alert(fun1());

        2>使用return 关键字,返回内容

             function fun2(a,b){
                alert('fun2');
                return a+b;
            }
            alert(fun2(1,2));//3 

        3>return 关键字,在js中也可以作为结束方法运行的功能.

            function fun3(){
                alert('aaa');
                return ;
                alert('bbb');
            }
            fun3();//aaa

        4>void运算符的应用:用来拦截函数的返回值的.
            alert(void(fun2(1,2)));//undefined
            <a href="javaScript:void(0)"  >点我</a> //点击没有任何反应

8.ECMAScript中对对象的分类


本地对象
    内建对象 ==> 不需要创建实例.直接使用 Global  Math
主机对象 ==> DOM BOM 两部分.

9.ECMAScript中3个包装对象.

String Number Boolean
伪对象: string number boolean 这3个原始类型可以看作是伪对象, 能直接调用包装对象的方法和属性.
Boolean 和 Number 类型 中的方法在开发中几乎不可能用到.
String对象==> 学习重点.
    属性
        length
            eg:
                var str1 = "abc"; 
                var str2 = new String("abc");
                alert(str1.length);
                alert(str2.length); 
                alert(typeof str1); //string
                alert(typeof str2); // object
    方法
    1 没用的方法
        alert(str1.big());
        alert(str1.sub()); 
        alert(str1.bold());
    2 重要的方法
        //indexOf
        //lastIndexOf
        //charAt 
        //alert(str1.charAt(0));//a
        //charCodeAt 返回所在字符的asc码
        //alert(str1.charCodeAt(0));//97
        //subString 
        alert(str1.substring(0, 1));//a 
        //slice 支持负数. 从右往左.
        alert(str1.slice(0, -1));//a
    3 与正则结合的方法(正则对象讲完回来看.)
        //split
        //replace
        //match
        //search

3个包装对象做类型转换

    // string ==> boolean
    var b1 = new Boolean("abc");
    //boolean ==> string
    var str1 = new String(true);
    // number ==> string
    var str2 = new String(123);
    //string ==> number
    var num1 = new Number("123");
    //....

instanceof运算符.

    var num1 = new Number("123");
    alert(num1 instanceof Number);//true
    alert(num1 instanceof Object);//true
    alert(num1 instanceof String);//false

10.Global对象 不需要创建实例直接使用即可.

6个方法==> 关于解码,编码的方法
    1.encodeURI 编码 只编码汉字
    2.decodeURI 解码

        var url = "http://www.baidu.com?name=?张/三:"
        var url2 = encodeURI(url);
        alert(decodeURI(url2));//张三

    3.encodeURIComponent 编码 当提交的值中包含一些url中的敏感符号时,使用该方法对敏感符号编码.
    4.decodeURIComponent 

        alert(encodeURIComponent(url));

    5.escape  已经过时
    6.unescape 已经过时
    isNaN  判断某个值是否是NaN ==> NaN==NaN=>false 

        alert(isNaN(NaN));//true
        alert(NaN == NaN);//false

    7.parseInt   转换成整数

        var str = "123abc";

        //1.使用 +
        //2.使用 new Number()
        //3.parseInt 

        alert(typeof parseInt(str));//number
        alert(+str); //NaN
        alert(new Number(str));//NaN
        alert(parseInt(str));// 123

        //区别: 1,2两种转换属于将字符串整体进行转换.如果字符串中包含1个或以上转换不了的字符,返回NaN
        //3 从左到右 依次转换,能转一个是一个,直到遇到不能转换的值停止.


    8.parseFloat 转换成浮点数

        //与上面的parseInt一样.区别是支持转换小数
        var str = "3.1415.9265357";

        alert(parseInt(str));// 3
        alert(parseFloat(str));//3.1415

11.Math对象

属性内建对象==> 不需要创建实例,直接使用即可.

属性
    //PI ==> 3.14159 圆周率

方法
    //random方法 ==> 返回随机数 0~1之间的随机数 包括0不包括1

    //alert(Math.random());

    //round方法==> 四舍五入方法.
        //返回0~100之间的随机数.0 和100 都可能出现
            //alert(Math.round(Math.random()*100));

    //max/min 方法 ==> 接收两个参数,比较之后返回最大/最小的那个.

        alert(Math.max(1,2));//2

    //pow ==> 计算参数1的参数2次方.

        alert(Math.pow(2,3));//8

12.ECMAScript中其它对象.

1.Array对象  ==> 数组
    1.创建方式

        1>创建方式1 创建一个数组并初始化值
        var arr1 = ["abc",2,true,null,undefined,new Object()]; 
        2>创建方式2 同方式1
        var arr2 = new Array(1,2,3);
        3>创建方式3 ==> 创建一个长度为3的数组. 数组Array的构造函数,如果只传一个参数,并且这个参数是整数.那么这个整数就是数组的初始化长度.
        var arr3 = new Array(3);

    2.属性
        length ==> 数组的长度
            alert(arr1.length);//6
            alert(arr2.length);//3
            alert(arr3.length);//3 
        js中数组的特点:
            1.js中的数组,类型任意.
            2.数组的长度不是固定的.用到哪里,就有多长.
                arr3[8] = 10;
                alert(arr3.length);//9
                alert(arr3[6]);//undefined

    3.方法
        var arr4 = [1,2,3];
        1.join方法==> 将数组中的每个元素连接起来返回一个字符串.参数就是连接符.(默认连接符是",")
        alert(arr4.join(""));//使用该方法可以模拟一个StringBuilder

        join方法的高级应用.
            /*
                var str1 = "a";
                var str2 = "b";
                var str3 = "c";
                 alert(str1+str2+str3);

                 ["a","b","c"] ==> "abc"
            */
        2.push/pop ==> 模拟栈的结构.
        3.shift/unshift==> 模拟队列的结构

        4.reverse方法 ==> 将数组中的元素顺序倒置
            alert(arr4.reverse());//3.2.1
        5.sort方法 ==> 排序的方法. 
            注意: 该方法默认排序规则,按照字符串规则排序.
            如果需要按照数字排序,需要准备一个比较器.
            var arr5 = [2,9,3,100,5,7,1];

            alert(arr5.sort(abc))

            //函数对象==> 比较器
            function abc(a,b){
                /* if(a>b){
                    return 1;
                }else if(a==b){
                    return 0;
                }else{
                    return -1;
                } */

                return a-b;
            }


2.Date对象

    1.获取对象
        new Date() 获取当前时间
        //空参构造获得当前时间
        var date = new Date();//当前时间
        //填入毫秒数,获得毫秒数对应的时间
        var date2 = new Date(10000000000000);

    2.方法

        2.getFullYear() 获取年份
        3.getMonth() 获取月份注意 1月份结果为0
        4.getHours() 小时
        5.getDate() 日期
        6.getMinutes() 分钟
        7.getSeconds() 获取秒
        8.getTime()  获取毫秒值.
        9.toLocaleString() 获取本地的时间格式字符串. 
        10.getDay();获得星期

    3.注意
        1.月份计数时是0~11月,所以要加1获得正常月份
        2.星期计数是 0~6 .

3.正则对象

    1.构造方法
        //参数1 正则字符串 ,参数2 匹配模式
        //用户名必须 以字母开头,长度在6到10位之间.
        //匹配模式有两种 
        //"i": 忽略大小写. ignoredCase
        //"g": 全局匹配 global
        var reg1 = new RegExp("^[a-zA-Z][a-zA-Z_0-9]{5,9}$","g");
        var reg2 = /^[a-zA-Z][a-zA-Z_0-9]{5,9}$/g;
    2.方法
        //test方法 ==> 测试字符串与正则是否匹配.
        var username = "a3456";
        alert(reg1.test(username));//true

        //与String对象结合的4个方法
        var str = "hello world";
            //split 切割字符串
                alert(str.split(/o/g));
            //replace 查找替换
                alert(str.replace(/o/g, "haha"));
            //search 只能找第一个出现的位置. 如果需要查找第n个出现的位置使用exec方法.
                alert(str.search(/o/g));
            //match ==> 找到字符串中符合正则表达式的部分并返回.
                alert(str.match(/o/g));

JS(BOM)

1.Browser Object Model ==> 浏览器对象模型 ==> 控制浏览器的一些行为

window对象代表一个html文档.

1.方法
    alert\confirm\prompt\close
    open => 打开一个新的窗口
    //语法window.open(URL,name,features,replace)
        // 参数1.新打开窗口的地址
        // 参数2.(没有用) 新打开窗口的名称.
        // 参数3. 新窗口的一些特征
        // 参数4. (没有用) 需不需要用新打开的窗口记录来替换调用open方法页面的历史记录.
        // 返回值: 返回新打开窗口的window对象.

    var baiduWindow = open("http://www.baidu.com","","width=200,height=100");

    alert(baiduWindow);

    总结: window对象是由浏览器创建的,加载文档时,浏览器就自动创建出来了.我们直接使用方法和属性即可.
    理论上window对象调用方法和属性时,不需要加前缀. 推荐加上"window.",


    // setInterval clearInterval
    // setTimeout  clearTimeout

    // 定时器方法 ,设置定时器(setInterval), 清除定时器(clearInterval).

    //参数1: 接受一个字符串.这个字符串是js代码.
    //参数1: 还可以接受一个函数对象.
    //参数2:接受一个整数,单位是毫秒
    //返回值: 打开的定时器的ID
    //每隔参数2毫秒数执行参数1代码或函数.
    window.setInterval("alert('aaa');", 3000);

    var ID = window.setInterval(fun1, 3000);

    function fun1(){
        alert('bbb');
    }
    //clearInterval ==>  清除定时器

    window.clearInterval(ID);

    eg:

        <body>
            <input type="text" size="30" id="one" /><br/>
            <input type="button" id ="two" value="开始" onclick="fun1();" />
            <input type="button" id ="three" value="结束" onclick="fun2();" />

        </body>

        <script type="text/javascript">
            var id;

            //控制文本框中内容
            //document.getElementById("one").value= "123";
            function fun1(){
                  setTime();
                //3.调用setInterval 每隔一秒调用一次setTime方法.
                if(!id){
                 id =   window.setInterval(setTime, 1000);
                }
            }

            function setTime(){
                //1.获得当前时间
                var date = new Date();
                //2.交给文本输入框显示
                document.getElementById("one").value= date.toLocaleString();
            }
        //停止时钟
            function fun2(){
                //
                clearInterval(id);
                id = undefined;
            }
        </script>

2.window的其它对象


1.history对象代表当前页面的访问历史

获得: history对象是window对象的属性.
    var history = window.history;
属性
    length --> 当前标签页一共浏览过几个页面

方法
    forward ==> 前进
    back ==> 后退
    go ==> 前进或后退

2.Location对象代表了当页面的地址
属性
    href  ==> 用来改变当前页面的地址
方法 
    参数1,可以填一个url, 刷新到url指定页面.
    reload() ==> 刷新当前页面
    function fun1(){
                window.location.href = "http://www.baidu.com";
            }
    function fun2(){
        window.location.reload();
    }   

JS(DOM)

Document Object Model ==> 文档对象模型 ==> 让JS 和 HTML ,css结合.可以使用JS来控制他们.

DHTML技术

由微软提出, Dynamic HTML 动态网页技术. 整合了 HTML CSS Javascript DOM 4个技术.
可以理解为对DOM对象的增强: 增加了一些新的属性和方法.让我们开发更加便捷.
例如: 
    一个元素的class属性,我们想改变,我们使用setAttribute("class","类名")可以.但是DHTML提供了更方便的操作,className属性.

1.获得元素对象

<font id="one" color="red" >哈哈</font>
<script type="text/javascript">
//以下这些对象全都不是我们自己创建 的. 浏览器创建的.加载html文档时就已经创建了.
//获得文档对象 
    var doc = window.document;
        alert(doc.nodeName); //#document
        alert(doc.nodeValue); // null
        alert(doc.nodeType); // 9
//获得元素对象
    var font = document.getElementById("one");
        alert(font.nodeName); //font
        alert(font.nodeValue); // null
        alert(font.nodeType); // 1
//获得属性对象
    var color = font.getAttributeNode("color");
        alert(color.nodeName); // 属性名称
        alert(color.nodeValue); // 属性值
        alert(color.nodeType); // 2 
//获得文本对象
    var text = font.firstChild;
        alert(text.nodeName); // #text
        alert(text.nodeValue); // 文本内容
        alert(text.nodeType); //  3

1.获得元素对象,方式01

    //获得元素对象 , 在整个文档范围内查找一个 id值为one的元素对象.
    <font id="one" color="red" >哈哈</font>
    var font = document.getElementById("one");  

2.获得元素对象,方式02

    //获得元素对象 , 在整个文档范围内查找一个元素名称为font的元素对象.
    //返回一个 元素数组(nodeList,在js中就当数组用)
    <font  color="red" >哈哈</font>
    var font = document.getElementsByTagName("font")[0];

3.获得元素对象,方式03

    <font class="one" color="red" >哈哈</font>
    //获得元素对象 , 在整个文档范围内查找Class名称为one的元素对象数组.
    //返回一个 元素数组(nodeList,在js中就当数组用)
    var font = document.getElementsByClassName("one")[0];

4.获得元素对象,方式04

    <font name="one" color="red" >哈哈</font>
    //获得元素对象 , 在整个文档范围内查找Name名称为one的元素对象数组.
    //返回一个 元素数组(nodeList,在js中就当数组用)
        var font = document.getElementsByName("one")[0];


5.在元素范围内获得元素的方式

    <div id="one" >
        <div id="two" class="two" name="two" ></div>
    </div>

    <script type="text/javascript">
        var one = document.getElementById("one");
        //根据ID查找里面的div ==> 不支持
        /* var two =    one.getElementById("two");
        alert(two); */
        //根据 class查找 ==> 支持
            /* var two = one.getElementsByClassName("two")[0];
            alert(two); */
        //根据name查找 ==> 不支持
            /* var two = one.getElementsByName("two")[0];
            alert(two); */
        //根据标签名称查找==> 支持
            var two = one.getElementsByTagName("div")[0];
            alert(two);
    </script>

2.DOM中的事件

事件: 给对应的元素对象,添加一个Function类型的属性.
这个function对象会在相应的实例被调用.
调用的时机跟属性的名称有关.

<div id="one" ondblclick="alert('bbb');" >
    这是div
</div>
<input type="text" id="two" /><br/>
<select id="three" >
    <option>河北</option>
    <option>西藏</option>
    <option>新疆</option>
</select>

//1.div获得到
var one = document.getElementById("one");
//2.为div新增一个属性( Function)
one.onclick = function (){
    alert('aaa');
} 

3.被支持的常用事件有哪些?
    //1.onblur 
    //2.onfocus
    var two =  document.getElementById("two");
        two.onfocus=function (){
            alert("onfocus");
        }
        two.onblur=function (){
            alert("onblur");
        }

    //3.onchange 
    var two =  document.getElementById("two");
        two.onchange=function (){
            alert("onchange");
        }
    //----
        var three =  document.getElementById("three");
        three.onchange=function (){
            alert("onchange");
        }

    //4.onkeydown 
        var two =  document.getElementById("two");
            two.onkeydown=function (event){
                if(event.keyCode == 13){
                    alert("表单提交啦!");
                }
            }

    //5.onload 

    <body onload="fun1();">
        <input type="text" id="two" /><br/>
    </body>

    //6.onmousedown 鼠标按钮被按下。
    //7.onmouseup 鼠标按键被松开。 
    //8.onmouseover 鼠标移到某元素之上。
    //9.onmouseout 鼠标从某元素移开。
    //10.onmousemove 当鼠标悬停时,连续被触发.。 

    function fun1(){
        var two =document.getElementById("two");
        two.onmousedown=function (event){
            //鼠标按键按下时触发
            //获得按下的是哪个键
            alert(event.button);
        }
        two.onmouseup=function (){
            alert("onmouseup");
        }
        two.onmouseover=function (){
            alert("onmouseover");
        }
        two.onmouseout=function (){
            alert("onmouseout");
        } 
        two.onmousemove=function (event){
            //alert("onmousemove");
            alert(event.clientX+"=="+event.clientY);
        } 


    //11.onsubmit 当表单提交之前触发

    <body onload="fun1();">
        <form id="two" >
            <input type="text" name="name"  ><br/>
            <input type="submit" value="提交" />
        </form>
    </body>

    function fun1(){
        var two =document.getElementById("two");
        two.onsubmit=function(event){
            alert('onsubmit');
            //做验证的话.如果验证失败,如何拦截表单提交?
            //拦截方式一:
                    //该事件是众多事件中最特殊的一个.
                    //该事件可以返回一个boolean型的值
                    // true==> 表单提交
                    // false ==> 拦截表单提交
                    //return false;
            //拦截方式二: 
                    //preventDefault() => 

                event.preventDefault();
        }
    }


    //12.event.stopPropagation() 不再派发事件。
    终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后,该节点上处理该事件的处理程序将被调用,事件不再被分派到其他节点。

    function fun1(){
        var one =document.getElementById("one");
        var two =document.getElementById("two");
        one.onclick=function(){
            alert("oneoneoneone");
        }
        two.onclick=function(event){
            alert("twotwotwotwo");
            event.stopPropagation();
        }
    }

3.节点的CURD

1.动态为div增加一个a元素,点击之后跳转到传智首页

function addNode(){
    //1.创建a元素 <a></a>
    var aEle = document.createElement("a");
    //2.为a元素添加属性
    aEle.setAttribute("href", "http://www.itcast.cn");
    //3.为a元素添加文本
    aEle.innerHTML = "传智播客";
    //4.获得目标div
    var div_1 = document.getElementById("div_1");
    //5.添加
    div_1.appendChild(aEle);
}

2.把div_2删除

function deleteNode(){
    //1 获得要删除的元素
    var div_2 = document.getElementById("div_2");
    //2 找到该元素的父亲
    var parent= div_2.parentNode;
    //3 删除
    parent.removeChild(div_2);
}

3.将div_3替换成一张图片

function updateNode(){
    //1 找到要替换的div
    var div_3 = document.getElementById("div_3");
    //2 找到div的父亲
    var parent = div_3.parentNode;
    //3 创建一个img元素对象
    var imgEle = document.createElement("img");
    //4 添加属性(src)
    imgEle.setAttribute("src", "001.jpg");
    //5 替换
    parent.replaceChild(imgEle, div_3);
}

4.将div_4 复制,并加入到页面末尾

function copyNode(){
    //1 获得要复制的div
    var div_4 = document.getElementById("div_4");
    //2 复制  cloneNode=> 参数 如果是false.那么只复制本身不复制子节点.
                              //true==> 复制本身和所有子节点
    var div_copy = div_4.cloneNode(true);
    //3 获得父亲
    //4 添加
    div_4.parentNode.appendChild(div_copy);
}

4.复习

Dom中的五类对象:

    Document 文档(重点)
    Element  元素(重点)
    Attribute 属性
    Text 文本
    Commons 注释
以上五类对象抽取了一个父类:
    Node 
        自身属性:
            nodeType
            nodeName
            nodeValue
        导航属性:
            父找儿: firstChild lastChild childNodes
            儿找父: parentNode (重要)
            找兄弟: nextSibling priviousSibling
获取Element的方式(重点):
    从Document中获得ELement:
        1.getElementById
        2.getElementsByTagName
        3.getElementsByClassName
        4.getElementsByName
    从Element中获得ELement:
        1.getElementsByTagName
        2.getElementsByClassName

DOM中的事件

给Element对象添加一个FUnction类型的属性.那么这个Function的运行时机与属性的名称有关.例如: 
属性名     触发时机
onClick     单击
ondblclick  双击
onload      当加载完毕
onchange    当内容改变
onblur      当失去焦点
onfocus     当得到焦点
...............

在事件中我们想要获得事件的详情,那么我们需要拿到Event(侦探)对象. 获得:

事件函数是由浏览器在对应时机调用的,浏览器在调用的时候,已经Event传给我们了.对于我们来讲.接受下就可以了.

属性:

keyCode  :  按键的编码
button   :  鼠标按键的编码
clientX/clientX : 鼠标所在位置的x y轴坐标

方法:

preventDefault : 阻止默认行为. 例如 :在点击submit按钮时,表单提交就是默认动作.
stopPropergation : 停止事件的继续传播. 例如: 在嵌套的DIV中,点击里面的div ,同时也会触发外层div的onclick事件.如果不想触发外层使用该方法.

Dom中常见操作

增
    创建元素:  document.createElement
    添加: element.appendChild => 添加到末尾
          element.insertBefore => 指定添加位置
删
    removeAttribute 删除属性
    removeChild  删除子节点
改
    replaceChild 改元素
    setAttribute 改属性
查 
    getAttribute 查属性值
    getElementById
    getElementsByTagName
    getElementsByClassName
    getElementsByName

Day03

XML

1.什么是XML,为什么学习XML?

Extensible Mark-up Language, 可扩展标记语言。

2.应用

1.在XML语言中,它允许用户自定义标签。一个标签用于描述一段数据;
一个标签可分为开始标签和结束标签,在开始标签和结束标签之间,又可以使用其它标签描述其它数据,以此来实现数据关系的描述。

2.XML技术除用于保存有关系的数据之外,它还经常用作软件配置文件,以描述程序模块之间的关系。
在一个软件系统中,为提高系统的灵活性,它所启动的模块通常由其配置文件决定
例如一个软件在启动时,它需要启动A、B两个模块,而A、B这两个模块在启动时,又分别需要A1、A2和B1、B2模块的支持,为了准确描述这种关系,此时使用XML文件最为合适不过。

3.CDATA区

在编写XML文件时,有些内容可能不想让解析引擎解析执行,而是当作原始内容处理。
遇到此种情况,可以把这些内容放在CDATA区里,对于CDATA区域内的内容,XML解析程序不会处理,而是直接原封不动的输出。
语法:<![CDATA[ 内容 ]]>
<![CDATA[
    <itcast>
        <br/>
    </itcast>
]]>

4.xsd约束

<?xml version="1.0"?>
<xsd:schema xmlns="http://www.itcast.cn/xml"
        xmlns:xsd="http://www.w3.org/2001/XMLSchema"
        targetNamespace="http://www.itcast.cn/xml" elementFormDefault="qualified">
    <xsd:element name="students" type="studentsType"/>
    <xsd:complexType name="studentsType">
        <xsd:sequence>
            <xsd:element name="student" type="studentType" minOccurs="0" maxOccurs="unbounded"/>
        </xsd:sequence>
    </xsd:complexType>
    <xsd:complexType name="studentType">
        <xsd:sequence>
            <xsd:element name="name" type="xsd:string"/>
            <xsd:element name="age" type="ageType" />
            <xsd:element name="sex" type="sexType" />
        </xsd:sequence>
        <xsd:attribute name="number" type="numberType" use="required"/>
    </xsd:complexType>
    <xsd:simpleType name="sexType">
        <xsd:restriction base="xsd:string">
            <xsd:enumeration value="male"/>
            <xsd:enumeration value="female"/>
        </xsd:restriction>
    </xsd:simpleType>
    <xsd:simpleType name="ageType">
        <xsd:restriction base="xsd:integer">
            <xsd:minInclusive value="0"/>
            <xsd:maxInclusive value="120"/>
        </xsd:restriction>
    </xsd:simpleType>
    <xsd:simpleType name="numberType">
        <xsd:restriction base="xsd:string">
            <xsd:pattern value="ITCAST_\d{4}"/>
        </xsd:restriction>
    </xsd:simpleType>
</xsd:schema> 

students.xml

<?xml version="1.0" encoding="utf-8" ?>
<!-- 
    1.书写根元素(因为xsd文件的引入是在根元素上进行的)
    2.在根元素上书写schemaLocation属性,填入命名空间,和xsd文件位置.(可以引入多个,没对之间用 空格/回车 隔开.)
    3.为引入的xsd定义一个前缀.xmlns="http://www.itcast.cn/xml"
    4.固定值. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 -->
 <students  xmlns="http://www.itcast.cn/xml" 
            xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
            xsi:schemaLocation="http://www.itcast.cn/xml students.xsd" >
        <student number="ITCAST_0001">
            <name>tom</name>
            <age>18</age>
            <sex>male</sex>
        </student>             
 </students>

5.xml解析

1.什么是解析xml?
    系统最终会从xml中读取数据.读取的过程就是解析.
    CRUD => 增删改查 => create read update delete => 解析指的就是读.
2.什么是解析器?
    就是用来解析xml的类.
    过滤器,拦截器,监听器....都是具备相应功能的java类而已.
3.两个常见的解析xml的思路!.
思想: 
    DOM:将文档中所有内容都封装成对象.读取时,将所有对象都加载到内存中.在内存中创建一颗dom树(记录对象间的关系).
        优点: 方便的进行增删改查.
        缺点: 会非常消耗内存.
    sax:事件驱动的.与pull解析类似.把xml文档的 读取过程,划分出5类事件.我们只要提供遇到每类事件做什么的锦囊即可.
        优点:内存占用小.
        缺点: 不能进行增删改的操作.

    DOM解析是由w3c推荐提出的.
    Sax解析是由民间提出的.


    DOM:
        把所有内容封装成了5类对象.
            document
            Element
            Attribute
            Text
            Commons
            共同的父类
            node
            NOde的属性:
                自身属性:
                    nodeType
                    nodeName
                    nodeValue
                导航属性
                    找子节点的:firstChild lastChild childNodes
                    找父节点的:parentNode
                    找兄弟节点:nextSibling previousSibling
        获得Element的方式
            getElementById           ==> Document
            getELementsByTagName     ==> Document/Element
            getELementsByClassName   ==> Document/Element
            getElementsByName        ==> Document
        对于增删改的操作:
            创建一个元素: document.createElement
            添加一个元素: element.appendChild ,element.insertBefore
            替换一个元素: element.replaceChild
            删除一个元素: element.removeChild

4.JAXP ==> JDK提供的 ==> java api for xml parser
    思想在java中的体现是接口.
    我们要开发的话需要接口的实现类.
    由各大解析器厂商提供实现接口的类.


    A a  = new AImpl(); // Aimpl2;
    A a  = new AImpl2();
//---上面的切换实现类的方式,需要该源代码,太过原始-----
    A a = JAXP.getXXX();==> 配置文件 ==> 我们通过修改配置文件就可以实现切换实现类.

    //反射.泛型.

//------------------------------------------------------------------------------------------
DOM4J ==> 框架 ==>  
Dom for java
DOM4J
//-------------------------------------------------------------------------------------------
DOM4J 整合两种思想.(SAX DOM)的思想.
使用sax的思想做读取xml.
又参照dom的思想,也在内存中创建了一颗对象关系树. 我们在学习的时候,参照之前我们学习的dom树即可.


//使用dom4j如何避免乱码?

    //要保证写入的编码和读取的编码一致.
        1.写入的编码如何控制?
            XMLWriter writer = new XMLWriter(new PrintWriter("src/students_copy.xml","UTF-8"),format);
        2.读取的编码如何控制?
            <?xml version="1.0" encoding="GBK"?>,其中encoding属性决定了读取时采用什么编码,而encoding属性由format.setEncoding("GBK");控制.
    //其实要保证不乱码上面的方法太弱了!
        方法: 使用字节流绝对不会出现乱码!如下:
        XMLWriter writer = new XMLWriter(new FileOutputStream("src/students_copy.xml"),format);

Day 06

Http协议

1.http请求协议


2.post请求


3.get请求


4.http响应协议


Tomcat与web项目结构

访问流程


1.程序架构.

BS
    优缺点:
CS
    优缺点:

2.TOMCAT服务器

1.如何修改端口号
2.如何配置虚拟目录(部署项目).
3.如何配置虚拟主机.(山寨百度)

3.MyEclipse与Tomcat的整合

1.配置tomcat到MyEclipse中.
2.在MyEclipse中开启关闭tomcat.
3.创建JAVAWeb项目.
4.部署/移除 项目.

4.HTTP协议.

规定浏览器和服务器之间的通信规则(格式).
请求协议:
    请求首行 ==>  请求方式  请求路径  协议/版本号
    请求头 ==>  键:值
    请求空行 ==> 空白行,用于分隔头与正文
    请求正文 ==> 只有POST请求有正文,表单提交的键值对
响应协议:
    响应首行 ==>  协议/版本号  状态码  状态码描述
    响应头 ==>  键:值
    响应空行 ==> 空白行,用于分隔头与正文
    响应正文 ==> HTML代码,CSS,JS,图片......

    状态码:
        200 成功
        404 资源未找到
        500 服务器内部错误(代码有问题)
        302 重定向(两次请求)
        304 缓存机制

有两个meta标签 .是模拟HTTP响应头的.
    Meta:<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
    响应头:Content-Type:text/html;charset=utf-8

    Meta:<meta http-equiv="Refresh" content="3;url=http://www.itcast.cn" >
    响应头:Refresh:text/html;3;url=http://www.itcast.cn

Day 07

Servlet

Servlet ==> server applet

servlet是我们学习的第一个动态资源.

1.servlet干什么用的?

处理请求,生成响应.

2.我们如何创建一个Servlet呢?

1>实现servlet接口即可.
2>继承javax.servlet.GenericServlet
3>继承javax.servlet.http.HttpServlet

3.Servlet的声明周期方法

生命周期指的是 必须要经历的过程.
对于servlet来讲,有3个生命周期方法.
    1> 出生 ==> init方法.在构造方法调用之后 调用.
    2> 使命 ==> service方法 ,当请求发来时,处理请求使用.
    3> 销毁 ==> destory方法, 当服务器关闭时,会销毁servlet,在销毁之前调用该方法释放资源.

4.Servlet中的其他方法.

getServletInfo ==> 获得servlet的信息(版本,作者,版权..),没用.
getServletConfig ==> 返回servletConfig对象.

5.ServletConfig对象是什么?

封装了servlet在web.xml中的配置.
方法:
    1>getServletName ==> 获得配置文件中 <servlet-name> 元素的内容
    2>getInitParameter ==> 根据 <init-param>中的 <param-name> 获得 </param-value>
        <init-param>
            <param-name>name</param-name>
            <param-value>tom</param-value>
        </init-param>
    3>getInitParameterNames 返回所有<param-name> .
    4>getServletContext(下午讲)

6.其他实现server的方式

    GenericServlet:
        1.帮我们妥善的保管ServletConfig对象
        2.实现了ServletConfig接口 ==> 为调用方便
        注意: 不要重写servlet接口中的 init方法.  不然 第一步优化就白做了. 
            我们要做初始化的动作,需要去重写GenericServlet提供的空参init方法.
    HTTPServlet:
        1.因为我们web项目基于HTTP协议,所以Service方法中传过来的request,response对象都是 基于HTTP协议的. 
            也就是HttpServletReueqst,也就是HttpServletResponse. 它帮我们进行了强转.
        2.我们有可能在不同的请求方式时做不同的事情. 根据请求方式不同,调用不同的方法 
        例如 GET --> doGet()
             POST ==> doPost();

7.Servlet中的其他细节

1>关于Servlet线程安全问题!
    因为在servlet运行期间只有一个servlet实例存在.可能会同时处理多个请求.
    那么我们在servlet中声明成员变量来存储用户数据是有线程安全问题的.
    我们应该如何解决呢?
        1.实现SigleThreadModel  (不推荐了!)
        2.使用局部变量保存用户数据.(推荐使用!)

2>关于servlet随着项目的启动而创建
    使用<load-on-startup>配置来实现.
    例如:
        <servlet>
            <servlet-name>AServlet</servlet-name>
            <servlet-class>cn.itcast.servlet.hello.AServlet</servlet-class>
            <load-on-startup>3</load-on-startup>
        </servlet>

填写一个整数,整数越小优先级越高.如果优先级一样,启动顺序按照配置顺序.
3>关于Servlet路径配置问题详解
    <url-pattern>  
        路径匹配:
            /AServlet            http://localhost:8080/Day07-servlet/AServlet
            /ABC/AServlet        http://localhost:8080/Day07-servlet/ABC/AServlet
            /ABC/ABC/AServlet    http://localhost:8080/Day07-servlet/ABC/ABC/AServlet
            /ABC/ABC/*           http://localhost:8080/Day07-servlet/ABC/ABC/oasdojasdjioasd
            /*                   http://localhost:8080/Day07-servlet/asdiojoiajsidojoasd
            / 相当于 /*         

        后缀名匹配:
            *.do ==> struts
            *.action ==> struts2
            *.html ==> 
注意:1.关于路径,配置的路径匹配范围越大优先级越低.
     2.两种匹配模式不能混用. 例如错误的例子: /*.do

4>关于tomcat的目录下的web.xml配置(了解)
    1. default servlet的配置
    2. jsp   servlet的配置
    3.  <session-config>
            <session-timeout>30</session-timeout>
        </session-config>
    4.互联网中所有mime类型
    5.欢迎页面配置

相关对象之 ---- ServletContext

1.获得: servletConfig ==> getServletContext

2.servletContext 的作用

1> servletContext 封装了web.xml 中的配置
    <context-param>
        <param-name>name</param-name>
        <param-value>jerry</param-value>
    </context-param>
    <context-param>
        <param-name>password</param-name>
        <param-value>1234</param-value>
    </context-param>

    getInitParameterNames();  ==> 获得所有键
    getInitParameter(key);  ==> 根据键获得对应的值
2> servlet技术中3大域对象之一. 
    ServletContext对应着Application(应用)域.利用了一个项目中只有一个ServletContext实例的特点.在servletContext中放置了一个map用作数据通信.
    这个Map就是所谓域.
        关于域的操作,有4个.
            放入键值对 setAttribute(key,value)
            通过键取值 getAttribute(key)
            通过键删除 removeAttribute(key)
            遍历所有键 getAttributeNames()
        application ==> servletContext
        session ==> 
        request ==> 
3>获得项目中资源.  
    所有servletContext中关于路径的获得,相对路径都是相对的 WebRoot(项目根)下
        getRealPath  ==> 通过相对路径获得绝对路径
        getResourceAsStream ==> 根据相对路径获得指定资源流

        //如果获得的是包下的,那么太麻烦了.
        //一:使用getClass().getResourceAsStream方法,相对路径分为两种情况
                //1: 加"/"  ==> 相对的是classes目录
                //2: 不加"/" ==> 相对的是本类当前目录
                    InputStream is = this.getClass().getResourceAsStream("students.xml");
                    System.out.println(is);
        //二:使用this.getClass().getClassLoader().getResourceAsStream("");获得
                //只有一个相对路径 ==> 就是相对于 classes目录
                    InputStream is2 = this.getClass().getClassLoader().getResourceAsStream("students.xml");
                    System.out.println(is2);



//注意: 使用类和类加载器加载资源文件时
        //1 jvm运行期间只加载一次. 但是使用下面的代码可以解决这个问题.
            String path = this.getClass().getClassLoader().getResource("students.xml").getPath();
            File file = new File(path.substring(1, path.length()));
            System.out.println(path);
        //2 getClassLoader()原本是用来加载.class文件的, 所以缓存设计的很小.不要用他加载一些别较大的资源.

3.servlet技术中对象的范围

servlet ==> 项目启动期间一个servlet只有一个servlet实例
request ==> 项目启动期间,request对象的数量,要看当前有多少个请求正在处理.
response ==> 同上.
servletConfig ==> 一个servlet实例对应一个servletConfig对象
servletContext ==> 整个项目中,永远只有一个servletContext实例存在.

4.servlet相关


5.静动态资源&servlet访问时序图


Day08

request & response

1.response 代表响应, 可以理解为一个空的箱子,我们在里面填入要发送到浏览器的内容. 服务器会把这些内容组装成http响应.

响应首行  协议/版本号  状态码  状态码描述
    添加状态码 和 描述
    void setStatus(int sc)  只设置状态码
    void setStatus(int sc, String sm)   设置状态码和描述
    void sendError(int sc) 只设置状态码,错误的
    void sendError(int sc, String msg)  设置状态码和描述
响应头
    添加响应头
        void setHeader(String name, String value) 设置响应头,如果key一样会覆盖
            setIntHeader(String name, int value) 
            setDateHeader(String name, long date) 

        void addHeader(String name, String value) 设置响应头,无论如何都新增.
             void addIntHeader(String name, int value) 
             void addDateHeader(String name, long date)  
响应空行
响应正文
    发送字节流
        getOutputStream
    发送字符流
        getWriter

1.例一:添加状态码

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
        response.sendError(404, "找到也不告诉你!");
}

2.例二:重定向

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
        //重定向方式1
         //1 返回状态码为302
            response.setStatus(302);
        //2 告诉浏览器去哪找新的地址  发送一个响应头: Location : http://www.baidu.com
            response.setHeader("Location", "/Day08-response/AServlet");、

        //重定向方式2
        //response.sendRedirect("/Day08-response/AServlet");
}

3.例三:响应头

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
        //解决乱码
        response.setContentType("text/html;charset=utf-8");
        //1.设置响应头 为Refresh:5;url=/Day08-response/AServlet
        response.setHeader("Refresh", "5;url=/Day08-response/AServlet");

4.例四:字节流编码解决乱码

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
        //1 获得输出字节流
        OutputStream os = response.getOutputStream();
        //2 输出中文
        os.write("你好 世界!".getBytes("GBK"));
        //3告诉浏览器使用GBK解码 ==> 乱码
        //os.write("<meta http-equiv='Content-Type' content='text/html;charset=gbk'>".getBytes());
        response.setHeader("Content-Type", "text/html;charset=gbk");
    }

5.例五:字符流编码解决乱码

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
    /*//控制字符流使用的编码,往上放.在获得字符流的时候,会来取这个编码.如果在取完之后设置,没有效果.
    response.setCharacterEncoding("UTF-8");
    //告诉浏览器使用什么码表解码
    response.setHeader("Content-Type", "text/html;charset=utf-8");*/
    //JAVAEE提供了一个方法,这个方法同时可以做 以上两件事.
    response.setContentType("text/html;charset=utf-8");

    //1 获得字符流
    PrintWriter pw = response.getWriter();
    //2 发送中文
    pw.print("你好 世界!");

    //问题: 同时使用两种流 会出现问题
    response.getOutputStream().write("haha".getBytes());//报500错误

}

6.例六:返回图片

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
        //0告诉浏览器 发给你的流的MIME类型. 
    response.setContentType("image/jpeg");
        //1 获得图片的输入流
    InputStream  in =   getServletContext().getResourceAsStream("/WEB-INF/001.jpg");
        //2 通过response获得输出字节流
    OutputStream out = response.getOutputStream();
        //3 两个对接
    byte[] buffer = new byte[1024];
    int len = 0;
    while((len=in.read(buffer))>0){
        out.write(buffer, 0, len);
        out.flush();
    }
    in.close();
}

7.例七:返回文件

public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws ServletException, IOException {
    //0 告诉浏览器是什么东西
            //getServletContext().getMimeType(".jar") Context对象根据 后缀名去web.xml查找mime类型.
        response.setContentType(getServletContext().getMimeType(".jar"));
    //告诉浏览器推荐用户使用什么名称下载
        response.setHeader("Content-Disposition", "attachment;filename=ValidateCode.jar");
    //1 获得图片的输入流
    InputStream  in =   getServletContext().getResourceAsStream("/WEB-INF/ValidateCode.jar");
        //2 通过response获得输出字节流
    OutputStream out = response.getOutputStream();
        //3 两个对接
    byte[] buffer = new byte[1024];
    int len = 0;
    while((len=in.read(buffer))>0){
        out.write(buffer, 0, len);
        out.flush();
    }
    in.close();
}

2.request

封装了浏览器发送来的请求信息.

请求首行  请求方式 请求路径  协议/版本号
request.getMethod(): GET
request.getRequestURI(): /Day08-request/AServlet
request.getServletPath(): /AServlet
request.getContextPath(): /Day08-request
request.getScheme(): http

请求头
//原始方式获得请求头
String getHeader(String name)  
long getDateHeader(String name) 
int getIntHeader(String name)
Enumeration getHeaders(String name)
Enumeration getHeaderNames() 

//javaee封装好的方法.
request.getContentLength(): -1
request.getContentType(): null
request.getLocale(): zh_CN
request.getQueryString(): name=tom&age=18
request.getRequestURL(): http://localhost:8080/Day08-request/AServlet
request.getRemoteAddr(): 0:0:0:0:0:0:0:1
request.getRemoteHost(): 0:0:0:0:0:0:0:1
request.getRemotePort(): 52074
request.getServerName(): localhost
request.getServerPort(): 8080

请求空行
请求正文 表单传送过来的键值对

获得表单提交的参数.
1.GET  http://localhost:8080/Day08-request/AServlet?name=tom&age=18
    乱码:只要确保编码和解码一致,就绝对没有问题.
        1.浏览器负责编码.浏览器使用的码表就是表单所在页面的码表.

        2.服务器负责解码.服务器默认使用ISO-8859-1解码. 如下配置的URIEncoding来决定解码码表
             <Connector port="8080" protocol="HTTP/1.1"  URIEncoding="UTF-8"
                connectionTimeout="20000" 
            redirectPort="8443" />
        如上配置会影响整个服务器不推荐.
            我们使用如下代码解决:
                //获得参数
                String name = request.getParameter("name");
                //因为服务器使用了错误的码表,那么我们按照错误的码表原路返回
                byte[] nameByte = name.getBytes("ISO-8859-1");
                //用正确的码表重新解码
                String newName = new String(nameByte,"UTF-8");

                System.out.println("解决之后的:"+newName);

2.POST
    因为Post解码是在第一次调用getParameter之前,那么解决乱码只需要在调用该方法之前设置编码:
        request.setCharacterEncoding("UTF-8");

        String name = request.getParameter("name");

        System.out.println(name);

    涉及到获得表单参数的方法还有哪些呢?
    String getParameter 根据键获得值
    Map getParameterMap()  获得服务器保存表单参数的容器. 就是map<String,String[]>. 泛型: habit=chi&habit=shui&habit=la
    Enumeration getParameterNames()  获得提交的所有键
    String[] getParameterValues(String name)  根据键获得值. 获得一键对应多个值的情况的.

3.request的请求转发和包含功能.


转发:
    一个Servlet处理完毕交给下面的servlet(JSP)继续处理.
作用: 
    在现实开发中,没有servlet转发给servlet的情况.都是由servlet转发给JSP.
    这样可以达到分工的作用:
        servlet: 比较适合处理业务.
        JSP: 比较适合显示功能
注意问题:
        //servlet中不要做 输出正文的动作,没有结果的
        //如果放到前面会出现乱码.
        //但是响应头是可以设置的.

包含:
    两个servlet(jsp)共同向浏览器输出内容.
作用:
    在现实开发中,多个页面含有相同的内容,我们把相同的内容抽取到一个jsp中,在需要显示这个段内容的jsp中,包含抽取的jsp.可以达到
    统一管理相同的内容.

4.request域的应用.

原理:
    在request对象中含有一个map.这个map就是request域.
作用:
    在将来开发中. 使用请求转发时,servlet处理完数据, 处理结果要交给jsp显示. 可以使用request域将处理结果有servlet带给jsp显示.

操作:
    1.setAttribute  存入一个键值对
    2.getAttribute  通过键取出值
    3.getAttributeNames 获得域中所有键
    4.removeAttribute 跟据键移除一个键值对        

request的范围:
    一个request对象对应一个request域(map).
    系统当前有多少个request就有多少request域.

5.路径总结:

路径分为两种情况:
    1.客户端路径 ==> 给浏览器用的路径
        <form action="/Day08-request/AServlet" >
        <a href="/Day08-request/AServlet" >
        <img src="/Day08-request/AServlet" >
        response.sendRedirect("/Day08-request/AServlet")
        Refresh:3;url=/Day08-request/AServlet
    路径写法:
        带"/" :  "/" ==> 相对于 主机.
            例如: 表单所在页面路径为==> http://localhost:8080/Day08-request/login.jsp ==> "/" 代表http://localhost:8080/

        不带"/":(开发中一定不要出现不带"/"的情况).代表从当前目录找.
            例如: 表单所在页面路径为==> http://localhost:8080/Day08-request/info/login.jsp ==> 代表 http://localhost:8080/Day08-request/info/


    2.服务器端路径
        <url-pattern> /AServlet  ==> http://localhost:8080/Day08-request/AServlet
        request.getRequestDispatcher("/AServlet") ==> http://localhost:8080/Day08-request/AServlet
    路径写法:
        "/": 相对于项目.  "/"==>http://localhost:8080/Day08-request/

Day09

JSP

java server page

本质就是servlet.

JSP的构成

HTML+JSP脚本(JAVA)+标签

HTML代码 => 使用 out.write()输出.

jsp中的脚本

<%  %> ==> 中可以写java代码 .该脚本中写的java代码会生成到jsp对应类中的service方法中.
<%= %> ==>  编译之后的代码: out.print(i );
<%! int i = 0; %>  ==> 编译之后,脚本中的代码会出现在类中. 可以使用该脚本定义全局变量和方法.
<%-- --%> ==> 被注释掉的内容不会参与编译. 搞清楚和<!-- --> html注释的区别.

Cookie

1.Cookie干嘛的?

会话(cookie,session)技术的一种.
因为http协议是无状态的,每次都是基于一个请求一个响应.每次请求和响应都跟上次没有关系.
我们需要记录之前对话信息.
cookie技术.是属于客户端(浏览器)保存信息的技术.

2.cookie怎么用?

1.添加cookie到浏览器

    1>新建一个cookie(键值对)
    Cookie cookie = new Cookie("name", "tom");
    2>将cookie 添加到响应中
    response.addCookie(cookie);

2.浏览器发送cookie到服务器,如何取

    1>获得所有浏览器发送的cookie
        Cookie[] cookies  = request.getCookies();
    2>遍历并判断我们要找的cookie
            if(cookies!=null && cookies.length>0){
                for(Cookie c : cookies){
                        if(c.getName().equals("name")){
                            System.out.println("获得的cookie:"+c.getName()+":"+c.getValue());
                        }
                }
            }

3.cookie原理.

让浏览器记住键值对.是向响应头中添加一下头即可:
    set-Cookie:name=tom;
浏览器记住之后,向服务器发送键值对,是在请求头中添加下面的信息:
    Cookie: name=tom;

4.cookie细节问题:

1.浏览器记多久?
    默认是在会话期间有效.(关闭浏览器,cookie就被删除).(有效时间-1)
2.有效时间如何设置?
    //设置cookie的最大有效时间
    1>设置一个正数,标示最大有效时间.单位是秒
    //cookie.setMaxAge(60*60);
    2>设置为-1 , 就是相当于默认有效时间, 浏览器关闭就消失.
    //cookie.setMaxAge(-1);
    3> 标示cookie的有效时间为0.发送到浏览器就消失了.
            //利用有效时间为0 这件事,我们可以做删除cookie的操作.
            // 因为同一个路径 ,不能存在相同的cookie(键相同).
            // 我们可以通过覆盖的方式,设置有效时间为0. 删除cookie
    cookie.setMaxAge(0);

3.浏览器在什么情况下发送cookie(路径)
        cookie的默认路径就是发送cookie的servlet所在目录.
            /Day09-cookie 
            /Day09-cookie/abc/xxxServlet
        访问路径如果是cookie路径的子路径那么,浏览器就会把该cookie告诉服务器.
4.cookie中的域 (了解)
    想要以下三个 主机和主机下的项目能共享一个cookie.
        www.baidu.com
        music.baidu.com
        map.baidu.com
    完成两步即可: 
        1.设置cookie的域为 ".baidu.com"
        2.设置cookie路径 为: "/" 
    以上就是跨主机访问cookie.不常用.

5.实例

例子一: 浏览历史.
例子二: 记住用户名.

Seesion

1.什么是session

服务器端保存会话信息的技术.

2.怎么用

1.如何获得session
    HttpSession session = request.getSession();
2.如何操作session
    session.setAttribute(arg0, arg1)
    session.getAttribute(arg0)
    session.removeAttribute(arg0)
    session.getAttributeNames()

3.原理

浏览器第一次访问服务器,服务器会在内存中开辟一个空间(session),并把session对应的ID发送给浏览器.
那么下次浏览器再去访问服务器,会把sessionID 交给服务器,服务器通过sessionID 找到刚才开辟的空间.
以上就是session的原理.

4.session细节问题

1> 服务器让浏览器记住sessionID的cookie 默认过期时间是 (-1)==> 关闭浏览器 cookie就丢失 ==>  cookie丢失 sessionID就丢失 ==> 找不到服务器的session 
2> session中除了 4个操作 map的方法之外,还有哪些方法.
    long getCreationTime()   获得创建时间
    String getId()    获得sessionID
    long getLastAccessedTime()   获得最后一次访问时间
    int  getMaxInactiveInterval()  获得session的寿命
    void setMaxInactiveInterval(int interval)   设置session的过期时间 
    void invalidate()   让session立即失效
    boolean isNew()  
3> 关于设置session的最大有效时间
    默认是30分钟. ==> 在tomcat的web.xml中 <session-config> 配置的.
    如何修改session的过期时间?
        1.修改在tomcat的web.xml中 <session-config> ==> 影响服务器中的所有项目
        2.在项目的web.xml中 加入<session-config> 配置.==> 影响的是当前项目
        3.通过setMaxInactiveInterval(int interval)方法设置.==> 当前操作的session

4>(了解内容)URL重写
    如果浏览器 禁用cookie功能不能保存任何cookie.那么session技术要是用 cookie来保存sessionID. 没有cookie怎么保存?
        使用url重写解决该问题.
        将页面中所有的连接 末尾全都加上 cookieid的参数. 这样用户点击连接访问网站,通过url把SeesionID带到了服务器.这样就解决了.
        但是 互联网行业没有这么干的.

5.例子

例子一:购物车;
    将想要购买的商品保存在服务器端(session).

例子二:验证码(session)

Day10

servlet技术中的3大域.

application==>servletContext : 范围是整个项目,只有一个servletContext对象, 所有servlet的组件都能访问到.
    应用: 保存全局的配置.
session ==> HttpSession : 范围是一次会话. 一个项目中存在几个Session呢? 一个没有保存sessionID的浏览器连接到服务器就会开启一个会话.有多少个浏览器访问就至少有多少个session.
    应用:购物车,验证码,登录信息
request ==> HttpServletRequest : 范围是一次请求之内. 存在几个request域?当前正在处理的请求有多少个.
    应用:转发中共享数据.

servlet技术3大组件

1.servlet 
2.filter  过滤器 *.do *.action
3.listener  监听器 

JSP技术

java server page

1.该技术干嘛的?

servlet先出现.只有servlet的时候,servlet又要处理逻辑又要负责输出html. 在servlet中输出 html 太痛苦. 推出了jsp技术.

专注于显示.

2.jsp的运行机制.

.jsp =(第一次访问jsp的时候)=> .java ==> .class(servlet) 

3.jsp编译成.java之后的目录在tomcat的 work目录下.

4.JSP中的脚本

<%%> : 直接写java代码,出现在jsp的servlet中的service方法中.
<%!%>: 直接写java代码,出现在jsp生成的servlet的类中. 声明类中的变量, 方法.
<%=%>: 输出, 写在该脚本中的代码,最后会出现在service方法 中,并以 out.print(); 包裹.

5.JSP中的注释

    <%-- --%> : 被注释掉的内容,不会生成到java文件中.
    <!-- -->  : html注释,将html代码发送给浏览器之后,给浏览器看的..

6JSP指令

三大指令:
    page 页面中的一些信息(最复杂)
        language: 描述当前页面使用的语言. 目前取值只有java.

        buffer="8kb" (不常用) : 决定缓存的大小.

        autoFlush="true"(不常用) : 如果缓存写满了.如果该属性为true,会将缓存中的自动输出到浏览器. 设置为false,将会报错.

        **import="java.io.FileOutputStream" 该属性用来导包. 唯一一个可以出现多次的.

        extends=""(不用) 绝对 jsp生成的java文件 继承哪个类.默认继承:org.apache.jasper.runtime.HttpJspBase.通过该属性可以改变.也必须是HTTPServlet的子类.

        **pageEncoding="UTF-8"  决定服务器读取jsp时 采用什么编码读

        **contentType="text/html; charset=UTF-8" 响应浏览器时 告诉浏览器用什么码表解码. 
            以上两个属性,只需要指定一个,另外一个会自动指定.

        errorPage=""(不常用)  当前jsp中出现了异常. 那么跳转到哪个页面.

        isErrorPage="false"(不常用) 标识当前页面是否是处理错误的页面.
            拓展: 错误页面可以使用如下统一配置
                <error-page>
                    <error-code>500</error-code>
                    <location>/zhiling/Demo2.jsp</location>
                </error-page>
        session="true"(不要修改) 页面中是否 需要使用session对象.如果为false,那么session内置对象会消失. 默认为true.

    include 页面包含指令(静态包含)

    taglib 引入标签指令

jsp编译后的源代码

 public void _jspService(HttpServletRequest 1>request, HttpServletResponse 2>response)
        throws java.io.IOException, ServletException {

            PageContext 3>pageContext = null;
            HttpSession 4>session = null;
            Throwable 5>exception = org.apache.jasper.runtime.JspRuntimeLibrary.getThrowable(request);
            if (exception != null) {
              response.setStatus(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
            }
            ServletContext 6>application = null;
            ServletConfig 7>config = null;
            JspWriter 8>out = null;
            Object 9>page = this;

九大内置对象

    类型              变量名称
-----------------------------------------
    HttpServletRequest  request 
    HttpServletResponse response
    HttpSession         session
    Throwable           exception
    ServletContext      application
    ServletConfig       config
没学过
    Object              page
    JspWriter           out
    PageContext         pageContext

1>page对象指向了当前servlet的实例.(一般没用)

2>JspWriter jsp中都是使用JspWriter再向外输出内容.

response.getWriter 和 JspWriter 有什么区别?
    response.getWriter的输出会出现在JspWriter输出的前面.
    JspWriter缓存会附加到response.getWriter缓存后.最终输出response.getWriter缓存.
    注意:JSP中不要直接使用response.getWriter.

3>PageContext 对象

1.page域. 范围只在当前页面当中.(4个域中最小一个域).
        //存值
        pageContext.setAttribute("", "");
        //取值
        pageContext.getAttribute("");
        //删除一个值
        pageContext.removeAttribute("");
2.还可以操作其他3个域.
    如何获得其他3个域代表的int值.PageContext中的常量.
            //存值
            pageContext.setAttribute("name", "tom",PageContext.REQUEST_SCOPE );
            //取值
            pageContext.getAttribute("name", PageContext.REQUEST_SCOPE);
            //删除一个值
            pageContext.removeAttribute("name", PageContext.REQUEST_SCOPE);
            //遍历所有键
            pageContext.getAttributeNamesInScope(PageContext.REQUEST_SCOPE);
3.还能获得其他8个内置对象. 
        pageContext.getRequest();

        pageContext.getResponse();

        pageContext.getSession();

        pageContext.getServletContext();

        pageContext.getServletConfig();

        pageContext.getOut();

        pageContext.getException();

        pageContext.getPage();

JSP标签(本身库很大,有很多标签,全都不用了.)

<jsp:useBean id="u" scope="page" class="cn.itcast.bean.User" ></jsp:useBean>
    相当于如下java代码
    User user = new User();
    pageContext.setAttribute("u", user);

<jsp:setProperty property="name" name="u" param="name" />
    相当于如下java代
    ((User)pageContext.getAttribute("u")).setName(request.getParameter("name"));

<jsp:getProperty property="name" name="u"/>
    相当于如下java代码
    out.print(((User)pageContext.getAttribute("u")).getName());

<jsp:forward page="/jspTag/Demo2.jsp">
     <jsp:param  name="name" value="tom" ></jsp:param>
</jsp:forward>
相当于如下代码
<%
    request.getRequestDispatcher("").forward(request, response);
    request.getParameterMap().put("name", new String[]{"tom"});
%>

<jsp:include page="/jspTag/Demo2.jsp">

</jsp:include>
相当于如下代码
<%
    //request.getRequestDispatcher("").include(request, response);
%>

JAVA BEAN

就是在写法上符合以下格式即可成为java bean

1.所有作为属性保存的成员变量私有化 ==> java不能脱离基本特性==> 封装性
2.有空参构造  ==>  使用内省可以帮你创建对象.
3.属性由对应get/set方法 ==> 1.满足了封装性, 2.命名规律的话,内省就能分辩出哪些是操作属性的方法,那些不是.

符合上面的格式,对我们开发来说有什么好处?

可以应用JAVA的内省机制.

BeanUtils 工具类

提供一个populate方法,可以把表单提交的参数自动封装到Bean中.
并且可以自动进行类型转换.
转换范围是 8个基本数据类型.
我们也可以注册一个转换器,让BeanUtils可以转换其他类型.(参照BServlet和MyConverter)

EL表达式

封装内省的操作. 可以通过EL表达式操作JAVA BEAN.

功能: 替代页面上的代码

1.使用EL内置对象,获得数据

EL的内置对象如下:

    1.requestScope
    2.sessionScope
    3.applicationScope
    4.pageScope
    //--------------通过以上4个内置对象可以对4大域进行访问
    //--------------下面的内置对象用处不大,
    5.param 
    6.paramValues  这两个对象封装了表单参数
    7.header
    8.headerValues 这两个对象封装了HTTP请求头
    9.initParam 封装了web.xml中 配置
    10.pageContex 封装了 9大内置对象中的 pageContext
    11.cookie  封装了cookie信息

2.使用EL表达式可以获取JAVABEAN属性 集合项的值.
<%-- EL表达式 内置对象的操作
    ${} ==> el的格式
--%>

<%
    request.setAttribute("name", "requestTom");
    session.setAttribute("name", "sessionTom");
    application.setAttribute("name", "applicationTom");
    //pageContext.setAttribute("name", "pageTom");

%>

${requestScope.name}==><% request.getAttribute("name"); %><br>
${sessionScope.name}==><% session.getAttribute("name"); %><br>
${applicationScope.name}==><% application.getAttribute("name"); %><br>
${pageScope.name}==><% pageContext.getAttribute("name"); %>EL表达式如果获得的值是null,那么什么都不打印.<br>
${name}==><% pageContext.findAttribute("name");//从最小的域开始,找key为name的属性值 %>

---------------------------------------------------------------------------------

<%--
    使用EL访问User对象
 --%>
 <%
    User u = new User();
    u.setName("tom");
    request.setAttribute("user", u);
%>
  ${requestScope.user.name}==><%((User)request.getAttribute("user")).getName(); %><br>
  ${requestScope.user['name']}==><%((User)request.getAttribute("user")).getName(); %><br>   
--------------------------------------------------------------------------------------------

<%
    使用EL访问数组
    String[] array = new String[]{"tom","jerry","jack","rose"};
    request.setAttribute("array", array);
 %>
  ${requestScope.array[2]} <br>
  <%
    使用EL访问List
        List<String> list = new ArrayList<String>();
        list.add("jack");
        list.add("rose");
        request.setAttribute("list", list);
   %>
   ${requestScope.list[1]}<br>

--------------------------------------------------------------------------------------------
   <%
    使用EL访问Map
        Map<String,String> map = new HashMap<String,String>();
        map.put("birthday", "now");
        map.put("haha.heihei", "hiahia");
        request.setAttribute("map", map);
    %>
    ${requestScope.map.birthday}<br>
    ${requestScope.map['birthday']}<br>
    ${requestScope.map['haha.heihei']}<br>

--------------------------------------------------------------------------------------------

<%-- 下面试试剩下7个内置对象  (不常用)
        5.param 
    6.paramValues  这两个对象封装了表单参数
    7.header
    8.headerValues 这两个对象封装了HTTP请求头
    9.initParam 封装了web.xml中 配置
    10.pageContex 封装了 9大内置对象中的 pageContext
    11.cookie  封装了cookie信息
--%>

${param.name } ==> <% request.getParameter("name"); %><br>
${paramValues.habit } ==> <% request.getParameterValues("habit"); %><br>
${header.Accept } ==> <%request.getHeader("Accept"); %><br>
${headerValues.Accept } ==> <%request.getHeaders("Accept"); %><br>
${initParam.name } ==> <% application.getInitParameter("name"); %><br>
${pageContext.request.contextPath } ==> <% ((HttpServletRequest)pageContext.getRequest()).getContextPath(); %><br>
${cookie.name.value } ==> <% 
            Cookie c = new Cookie("name","jerry");
            c.setMaxAge(60*60);
            response.addCookie(c);

            for(Cookie cookie : request.getCookies()){
                if(cookie.getName().equals("name")){
                cookie.getPath();
                }
            }
 %>

3.使用EL可以进行逻辑运算
<%
    request.setAttribute("num1", 10);
    request.setAttribute("num2", 20);
    //EL表达式支持如下运算符.
 %>

${num1 > num2} ==>${num1 gt num2}<br>
${num1 < num2} ==>${num1 lt num2}<br>
${num1 <= num2}==>${num1 le num2} <br>
${num1 >= num2}==>${num1 ge num2} <br>
${num1 == num2}==>${num1 eq num2} <br>
${num1 != num2}==>${num1 ne num2} <br>
${true && true}<br>
${true || true}<br>
${!true}<br>
${(num1 > num2)?"num1厉害":"老2厉害" }

EL函数库

1.什么是EL函数库,干什么用的?

简化页面中静态方法的调用,使用EL函数代替JAVA代码.

2.如何自定义EL函数库?

1>定义工具类,在类中定义静态方法
2>填写配置文件xxx.tld 放到WEB-INF下
    加入如下配置:
    <!--版本号(没啥用) -->
    <tlib-version>1.0</tlib-version>
    <!--推荐使用的前缀 -->
      <short-name>myFn</short-name>
      <!--给该标签库 起一个"包名" ,在页面中引入时 使用. -->
      <uri>http://www.itcast.cn/myFn</uri>

    <!--注册一个EL函数 -->
      <function>
        <!--声明函数名称 -->
        <name>getTime</name>
        <!--注册静态方法所在的完整类名 -->
        <function-class>cn.itcast.tool.Tool</function-class>
        <!-- 绑定类中的静态方法 -->
        <function-signature>java.lang.String getTime()</function-signature>
      </function>
    </taglib>


    demo:

    <?xml version="1.0" encoding="UTF-8" ?>

    <taglib xmlns="http://java.sun.com/xml/ns/j2ee"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd"
      version="2.0">

      <tlib-version>1.0</tlib-version>
      <short-name>myFn</short-name>
      <uri>http://www.itcast.cn/myFn</uri>

      <function>
        <name>getTime</name>
        <function-class>cn.itcast.tool.Tool</function-class>
        <function-signature>java.lang.String getTime()</function-signature>
      </function>
    </taglib>

3>页面中先引入.
    <%@ taglib prefix="myFn" uri="http://www.itcast.cn/myFn"  %>
    再使用.
    ${myFn:getTime()}
    其实就相当于
    <%=Tool.getTime() %><br>

3.学习系统自带的EL函数.

${fn:contains("hiahia", "hi")}<br> 判断是否包含
${fn:endsWith("abha", "ha")}<br>  判断是否以某字符串结尾(有BUG)
${fn:escapeXml("<font color='red'>haha</font>")}<br> 自动将html关键字符转义
剩下的是自学作业,,,


你可能感兴趣的:(javaweb)