學問是光明,矇昧是黑暗。唸書吧。與你共勉。
目錄
1、HTML
1.1、HTML是什麼
HTML稱爲超文本標記語言,是一種標識性的語言。它包括一系列標籤.通過這些標籤可以將網絡上的文檔格式統一,使分散的Internet資源連接爲一個邏輯整體。HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字,圖形、動畫、聲音、表格、鏈接等。哈哈哈哈,是不是感覺太官方了,那就看下面:
(1) HTML是一門標記(也叫做標籤或元素)語言,不是編程語言
(2) HTML是一門標記語言,是利用標記來組織網頁結構的
(3) 使用html開發的網頁文件,以".html"或".htm "(.shtml)爲後綴
(4) 使用html開發的網頁文件,由瀏覽器負責解析並執行(即顯示在瀏覽器中)
(5) HTML是文檔的一種,例如:word pdf txt…
1.2、HTML的結構
<!DOCTYPE HTML> 文檔聲明, 用來聲明HTML文檔所遵循的HTML規範和版本,上面是html5.0的聲明, 也是目前最常用的版本
<head></head> 頭部分, 用來存放HTML文檔的基本屬性信息, 比如網頁的標題, 文檔使用的編碼等, 這部分信息會被瀏覽器優先加載.
<body></body> 體部分, 用來存放網頁可視化數據. 即真正的網頁數據
<title></title> 聲明網頁的標題
<meta charset="utf-8"/> 用來通知瀏覽器使用哪一個編碼來打開HTML文檔, 這個編碼一定要和文件保存時的編碼保持一致, 纔不會出現中文亂碼問題.
1.3、HTML語法
1.3.1、html標籤
HTML是一門標記語言,標記也叫做元素/標籤,標籤分爲開始標籤和結束標籤。
<body></body> <table></table> <form></form>
如果標籤內沒有內容要修飾,可以合併成一個自閉標籤。
<meta/> <br/> <hr/> <input/> <img/>等等
1.3.2、html屬性
標籤都可以具有屬性,屬性可以有多個,多個屬性之間用空格隔開
<font size="7" color="red" face="華文琥珀">文本內容…</font>
提示:屬性的值用單引號或雙引號引起來,或者不用引號。通常使用雙引號引起來
1.3.3、html註釋
<!-- 註釋內容 -->,注意html註釋不能交叉嵌套
1.3.4、html空格和換行
<br/> 換行
空格
  中文狀態下的空格
1.4、HTML標籤
1)、圖像標籤
img標籤用於在網頁中插入一幅圖片
<img src="img/1.jpg" width="70%" border="5px"/>
src屬性:用來指定圖片的url地址(即圖片的所在路徑)
width屬性:指定圖片的寬度,單位可以爲px(像素)或者%(百分比)
height屬性:指定圖片的高度,單位可以爲px(像素)或者%(百分比)
2)、超鏈接
用於創建指向另外一個文檔的超鏈接(點擊後可以跳轉到另外一個文檔)
<a href="http://www.baidu.com" target="_blank">百度一下,你就不知道</a>
href屬性:用來指定點擊超鏈接後將要跳轉到的url地址
target屬性:用來指定以何種方式打開超鏈,其常用取值爲:
_self:默認值,在當前窗口打開超鏈接
_blank:在新的窗口中打開超鏈接
3)、表格標籤
<table>
<tr>
<td>11</td>
<td>12</td>
<td>13</td>
</tr>
<tr>
<td>21</td>
<td>22</td>
<td>23</td>
</tr>
<tr>
<td>31</td>
<td>32</td>
<td>33</td>
</tr>
</table>
table – 用來定義一個表格
tr – 用來定義表格中的行
td – 用來定義表格中的單元格
th – 用來定義表頭
4)、表單標籤
表單的作用是向服務器發送數據。
<form action="http://www.baidu.com" method="GET"></form>
action 必須存在的屬性,用來指定表單提交的目的地地址
method 可選屬性,用來指定以何種方式來提交表單,如果不指定,默認是GET提交
5)、表單項標籤
表單中可以有多個輸入項,輸入項必須有name屬性纔可以被提交,如果輸入項沒有name屬性,則表單在提交時會忽略它
a、input元素
<-- 普通文本輸入框-->
<input type="text" name="username" value="設置默認值"/>
<-- 密碼輸入框-->
<input type="password" name="password" value="設置默認值"/>
<-- 單選框 value用來指定選項被提交時的值, 如果不設置value, 選項被提交時, 值爲on.-->
<input type="radio" name="gender" value="man"/>
<-- 複選框-->
<input type="checkbox" name="like" value="lanqiu"/>
<-- 提交按鈕 用來提交表單用的-->
<input type="submit" value="按鈕上顯示的文本">
<-- 普通按鈕-->
<input type="button" value="按鈕上顯示的文本">
b、textarea多行文本輸入
<textarea name="description" cols="寬度" rows="高度">請輸入個人描述..</textarea>
cols屬性:設置輸入框寬度
rows屬性:設置輸入框高度
c、下拉選框
<select name="city">
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="gz" selected="selected">廣州</option>
</select>
其中selected屬性用來設置該選項默認被選中
value屬性用來設置選項被提交時的值
6)、表單細節問題
a、提交表單時,表單中的數據怎麼沒有被提交?
在表單中,每一個要提交數據的表單項標籤都要具有name屬性
b、如何讓多個單選框只有一個被選中?
設置這多個單選框的name屬性值相同,如果name相同,這多個單選框就默認是一個組,一個組就只能選中一個選項。
c、爲什麼單選框、複選框提交後的值都是on?
如果單選框或複選框沒有設置value屬性,選擇任何一個選項最終提交的值都是on,這樣服務器無法區分用戶到底選擇是什麼選項。
d、如何設置單選框、複選框默認選中一項?
只需要在單選框或複選框上面添加一個屬性: checked="checked",
e、如何設置下拉選框默認選中一項?
如果不設置,下拉選框默認選中的第一個選項,可以通過 selected="selected"屬性設置某一項默認被選中
f、下拉選框中的option選項上的value屬性的作用是什麼?
選中某一個option,在表單提交時,如果option上沒有value屬性,就提交option標籤的內容;如果option上有value屬性,就提交value屬性的值。
2、CSS
2.1、CSS簡介
層疊樣式表(英文全稱:Cascading Style Sheets)是一種用來表現HTML(標準通用標記語言的一個應用)或XML(標準通用標記語言的一個子集)等文件樣式的計算機語言。CSS不僅可以靜態地修飾網頁,還可以配合各種腳本語言動態地對網頁各元素進行格式化。 [1]
CSS 能夠對網頁中元素位置的排版進行像素級精確控制,支持幾乎所有的字體字號樣式,擁有對網頁對象和模型樣式編輯的能力
html的作用: 通過html標籤組織網頁的結構
css的作用: 渲染網頁、美化網頁
2.2、CSS在HTML中的引入
1)、通過標籤的style屬性引入
<div style="border:2px solid red;font-size:26px;background:pink;">
這是一個div...
</div>
2)、通過style標籤引入
放在head裏面
<style type="text/css">
/* ****** CSS樣式 ****** */
span{
border:2px solid green;
font-size:30px;
font-weight:bolder;
}
</style>
3)、通過link鏈接引入外部的CSS文件
放在head裏面
<link rel="stylesheet" href="demo.css"/>
2.3、CSS選擇器
1)、標籤名選擇器
根據標籤(元素)的名稱來選擇指定名稱的元素進行樣式的修飾,格式:標籤名{ css屬性… }
如:
span{
background:#DDA0DD;
font-size:24px;
font-weight:bolder;
}
2)、class選擇器
通過標籤上通用的屬性class,可以爲標籤指定所屬的類(組)進行樣式的修飾。格式:.類名{ css屬性… }
如:
.c1{ /* 表示選中所有class值爲c1的元素 */
background: #b1eb0a;
color: #0b190b;
}
.c2{ /* 表示選中所有class值爲c2的元素 */
background:#f3db09;
color: blue;
}
如果說一個標籤上有多個類選擇器,而這多個選擇器的樣式有相同的修飾屬性,那麼後面的樣式會覆蓋前面的樣式。
3)、id選擇器
通過標籤上通用的屬性id,可以爲標籤設置唯一的標識,格式:#id值{ css屬性… }
如:
#p1{ /* 選中id爲p1的元素 */
font-size:28px;
color: red;
text-indent: 20px;
}
4)、後代選擇器
選中父元素內部的指定後代元素,格式:父選擇器 後代元素{CSS樣式}
p span{/* 選中所有p元素內部的所有span元素 */
font-size: 20px;
color:green;
background: cyan;
}
5)、屬性選擇器
根據屬性條件選中元素進行修飾,格式:選擇器[屬性]{CSS樣式}
input[type='text'][name='user']{
/* 匹配元素名爲input的並且type的值爲text的元素 */
background:pink;
font-size:30px;
text-indent:30px;
}
2.4、常用屬性總結
此處,奉上一個大佬的總結
https://blog.csdn.net/yjn1995/article/details/90709767
3、JavaScript
3.1、JavaScript簡介
JavaScript(簡稱“JS”) 是一種具有函數優先的輕量級,解釋型或即時編譯型的高級編程語言。雖然它是作爲開發Web頁面的腳本語言而出名的,但是它也被用到了很多非瀏覽器環境中,JavaScript 基於原型編程、多範式的動態腳本語言,並且支持面向對象、命令式和聲明式(如函數式編程)風格。
嵌入在html網頁中的一門腳本語言,專門用於實現網頁的交互。JS嵌入在網頁中,由瀏覽器負責解析並執行。爲網頁添加各式各樣的動態效果或爲表單添加校驗,爲用戶提供更好的瀏覽體驗。
3.2、特性
1)、是一種解釋性腳本語言(代碼不進行預編譯)
2)、主要用來向HTML(標準通用標記語言下的一個應用)頁面添加交互行爲。
3)、可以直接嵌入HTML頁面,但寫成單獨的js文件有利於結構和行爲的分離。
4)、跨平臺特性,在絕大多數瀏覽器的支持下,可以在多種平臺下運行(如Windows、Linux、Mac、Android、iOS等)。
5)、Javascript腳本語言同其他語言一樣,有它自身的基本數據類型,表達式和算術運算符及程序的基本程序框架。
6)、可以實現web頁面的人機交互。
3.3、HTML中使用JS的方法
1)、在script標籤內部直接書寫JS
<head>
...
<!-- 第一種引入JS的方式 -->
<script>
alter("引入JS的第一種方式...");
</script>
</head>
可以放在head和body中
2)、通過標籤引入外部的JS文件
創建一個後綴爲js的文件,引入即可
<head>
...
<!-- 第二種引入JS的方式 -->
<script src="demo.js"></script>
</head>
注:如果標籤引入了外部的文件,那麼這個標籤內部不要再寫js,因爲寫了也不會執行
<script src="demo.js">
alert(333);//此處的代碼執行不到
</script>
3.4、JS語法
3.4.1、註釋
與Java一樣,//單行註釋 /*多行註釋*/
3.4.2、數據類型
JS的基本數據類型一共有五種,分別爲數值類型(number)、字符串類型(string)、布爾類型(boolean)、undefined、null。
數值類型:底層是浮點型,但是在需要時會在整型與浮點型轉換
字符串類型:可以用單引號或雙引號包裹
布爾類型:true和false
undefined:定義了變量卻沒有賦值
null:就只有一個值 null,表示空值。
3.4.3、變量聲明
1)、在js中用var聲明變量
var a = 10; //聲明變量,賦值爲數值10
var b = true; //聲明變量,賦值爲布爾值true
var c = "Hello JS"; //聲明變量,賦值爲字符串"Hello JS"
2)、在JS中聲明的變量不區分類型,可以指向任意的數據類型
3.4.4、運算符
算術運算符: +,-,*,/,%,++,--
賦值運算符: =,+=,-=,*=,/=,%=
比較運算符: ==,!=,>,>=,<,<=
位運算符: & , |
邏輯運算符: && ,||
前置邏輯運算符: ! (not)
三元運算符: 表達式 ? 表達式 : 表達式
3.4.5、js語句
if分支 switch for循環 while循環
3.4.6、js數組
聲明數組的方法
var arr1 = new Array();
var arr2 = new Array(88,"Hello" ,true , 100);
var arr3 = [];
var arr4 = [88,"Hello" ,true , 100];
3.4.7、js函數
function funName([參數1,參數2,…]){
需要執行的代碼
}
如圖,函數就是一個代碼塊,可以重複使用。
組成:function 方法名稱(參數){方法體}
函數的調用:方法名稱(參數)
3.5、js如何獲取元素
document.getElementById( id值 ) -- 通過元素的id值,獲取一個元素。返回的是表示該元素的js對象。
document.getElementsByTagName( 元素名 ) -- 通過元素名稱獲取當前文檔中的所有指定名稱的元素,返回的是一個數組
document.body -- 獲取當前文檔中的body元素
ele.parentNode -- 獲取當前元素的父元素。obj表示當前元素
document.createElement( 元素名稱 ) -- 根據元素名稱創建指定名稱的元素,返回的是表示新創建元素的js對象
parent.appendChild( child ) -- 通過父元素添加子元素,其中parent表示父元素,child表示子元素
parent.removeChild( child ) -- 通過父元素刪除子元素,其中parent表示父元素,child表示子元素
ele.innerHTML -- 獲取當前元素的html內容(從開始標籤到結束標籤之間的所有內容)
-- 或者, 還可以設置當前元素的html內容(如果元素內部有內容,將會覆蓋原有內容)
4、JQuery
4.1、簡介
jQuery是一個快速、簡潔的JavaScript框架,是繼Prototype之後又一個優秀的JavaScript代碼庫(或JavaScript框架)。jQuery設計的宗旨是“write Less,Do More”,即倡導寫更少的代碼,做更多的事情。它封裝JavaScript常用的功能代碼,提供一種簡便的JavaScript設計模式,優化HTML文檔操作、事件處理、動畫設計和Ajax交互。
jQuery的核心特性可以總結爲:具有獨特的鏈式語法和短小清晰的多功能接口;具有高效靈活的css選擇器,並且可對CSS選擇器進行擴展;擁有便捷的插件擴展機制和豐富的插件。jQuery兼容各種主流瀏覽器,如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等
4.2、特點
- 快速獲取文檔元素
- 提供漂亮的動態頁面效果
- 創建AJAX刷新網頁
- 提供對js的增強
- 更改網頁內容
- 增強的事件處理
4.3、JQuery的引入
使用JQuery的話,引入JQuery的函數庫即可,而JQuery函數庫就是一個js文件,裏面是大量的js函數。
<script src="js/jquery-1.8.3.js"></script>
使用JQuery時一定要注意代碼的位置,舉個栗子:
<script type="text/javascript">
/* 獲取id爲d1的元素的內容 */
//1.獲取id爲d1的元素
var h1 = document.getElementById("d1");
//2.獲取h1的內容(innerHTML)
alert( h1.innerHTML );
</script>
<body>
<h1 id="d1">引入jquery示例...</h1>
<body>
這段代碼運行的話會報錯,因爲代碼是由上往下運行的,在執行獲取id爲d1的元素時, h1元素還沒有被瀏覽器加載到,所以獲取不到h1元素。
解決辦法:
第一種:可以將js代碼放到h1元素的下面,讓瀏覽器先加載h1元素,再執行獲取h1的代碼。就可以正常執行。
第二種:將獲取h1元素的代碼放在文檔就緒事件函數中,文檔就緒事件函數會在瀏覽器加載完整個html文檔後立即執行!
$(function(){
//在整個文檔被加載完後立即執行...
})
4.4、JQuery的選擇器
元素選擇器
$("div") – 獲取所有div元素
$("span") – 獲取所有的span元素
類選擇器
$(".c1") – 獲取所有class值爲c1的元素
$("div.c1") – 獲取所有class值爲c1的div元素
id選擇器
$("#one") – 獲取id爲one的元素
後代選擇器
$("#one span") – 匹配id爲one的元素內部的所有span元素
相鄰兄弟元素選擇器
$("#one+span") – 匹配id爲one的元素後面緊鄰的span兄弟元素
等價於:
$("#one").next("span") – 匹配id爲one的元素後面緊鄰的span兄弟元素
$("#one").prev("span") – 匹配id爲one的元素前面緊鄰的span兄弟元素
$("#one~span") – 匹配id爲one的元素後面所有的span兄弟元素
$("#one").nextAll("span") – 匹配id爲one的元素後面所有的span兄弟元素
$("#one").prevAll("span") – 匹配id爲one的元素前面所有的span兄弟元素
$("#one").siblings("span") – 匹配id爲one的元素前、後所有的span兄弟元素
基本過濾選擇器
1、:first | :last
2、:eq(n)
$("div:first") – 匹配所有div中的第一個div元素
$("div:last") – 匹配所有div中的最後一個div元素
$("div:eq(0)") – 匹配所有div中的第一個div元素
$("div").eq(0) – 匹配所有div中的第一個div元素
$("div:eq(-1)") – 匹配所有div中的最後一個div元素
$("div").eq(-1) – 匹配所有div中的最後一個div元素
4.5、創建一個表格
function createTable3(){
//var rows = $("#rows").val();
//var cosl = $("#cosl").val();
var rows = document.getElementById("rows").value;
var cols = document.getElementById("cols").value;
var $tab = $("<table></table>");
for(var i=0;i<rows;i++){
var $tr = $("<tr></tr>");
for(var j=0; j<cols;j++){
var $td = $("<td></td>");
$td.html("我是td!")
//將td添加到tr內部
$tr.append( $td );
}
//將tr添加到table內部
$tab.append( $tr );
}
//將table添加到網頁中
$("body").append( $tab );
}
4.6、總結
$("<div></div>") -- 創建一個div元素,返回的是一個表示div元素的jQuery對象
$("<div>xxxx</div>") -- 創建一個包含內容的div元素,返回的是一個表示div元素的jQuery對象
$parent.append( $child ) -- 父元素調用方法添加子元素
$("body").append( "<div>我是新來的...</div>" ); -- 往body元素內部追加一個div子元素
$("div").remove() -- 刪除所有的div元素
$("div").replaceWith("<p>我是來替換的…</p>") --替換元素
$("div").html() -- 獲取所有div中的第一個div的內容
$("div").html("xxxx") -- 爲所有div設置內容
$("div").text() -- 獲取所有div中的所有文本內容
$("div").text("xxxx") -- 爲所有div設置文本內容
$("input").val() -- 獲取所有input元素中的第一個input元素的value值
$("input").val(值) -- 爲所有的input元素設置value值
5、HTTP
5.1、什麼是HTTP協議
HTTP是用於規定瀏覽器和服務器通信的方式。
主要規定了瀏覽器向服務器發送的請求信息的格式,
以及規定了服務器向瀏覽器做出的響應信息的格式。
請求只能由瀏覽器發起,服務器被動接收,一次請求對應一次響應。
5.2、HTTP協議詳解
1)、HTTP請求
請求行:GET /news/hello.html HTTP/1.1
GET: 提交方式,在HTTP協議中一共規定了7種提交方式,常用的只用GET和POST。
/news/hello.html: 請求的資源路徑
HTTP/1.1:請求所遵循的協議和版本
請求頭:請求頭都是Key-Value結構
請求實體:GET請求的話,請求實體不會有內容,只有是POST請求時,請求實體纔會有內容
2)、HTTP響應
狀態行:
HTTP/1.1:表示響應信息所遵循的協議和版本
200:狀態碼,表示請求處理的結果。
常見的有:
200:表示服務器處理請求的結果是成功的!
304/307:表示服務器通知瀏覽器使用緩存
400:表示請求參數類型不匹配
404:表示客戶端請求的資源不存在
500:表示服務器端在處理請求的過程中出現了錯誤或異常
若干響應頭:
響應頭的格式也是Key-Value結構
響應實體:
對應的請求內容返回的響應內容。
如果瀏覽器向服務器請求的是一個文件,服務器會將這個文件的內容作爲響應實體發送給瀏覽器.
5.3、GET和POST的區別
(1)GET提交會將請求參數拼接在URL地址的後面,顯示在地址欄中,相對不安全
(2)GET提交將參數顯示在地址欄中,數據量不能太大,不能超過1K或者是4K
(3)POST提交不會將參數拼接在地址欄後面, 而是通過請求實體將參數發送給服務器, 相對來說更加安全!
(4)POST提交通過請求實體傳數據給服務器, 數據量理論上沒有限制!
當向服務器傳輸大量的數據或者傳輸的數據較爲隱私,纔會使用POST提交。
6、Servlet
6.1、簡介
Servlet(Server Applet)是Java Servlet的簡稱,稱爲小服務程序或服務連接器,用Java編寫的服務器端程序,具有獨立於平臺和協議的特性,主要功能在於交互式地瀏覽和生成數據,生成動態Web內容。
狹義的Servlet是指Java語言實現的一個接口,廣義的Servlet是指任何實現了這個Servlet接口的類,一般情況下,人們將Servlet理解爲後者。Servlet運行於支持Java的應用服務器中。從原理上講,Servlet可以響應任何類型的請求,但絕大多數情況下Servlet只用來擴展基於HTTP協議的Web服務器。
因而,Servlet的作用是處理請求
6.2、如何開發一個Servlet程序
6.2.1、創建工程
寫一個類實現Servlet接口,並實現方法,在web應用的web.xml文件中配置Servlet程序對外訪問的路徑。
1)、創建一個Web工程
繼承HttpServlet類,默認會覆蓋doGet方法和doPost方法,兩個方法的作用爲:
* doGet方法:當瀏覽器發送請求的方式爲GET提交時, 將會調用doGet方法來處理請求
* doPost方法:當瀏覽器發送請求的方式爲POST提交時, 將會調用doPost方法來處理請求
6.2.2、Servlet在web.xml中的配置
<servlet>
<servlet-name>HelloServlet</servlet-name>
<servlet-class>com.tedu.HelloServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>HelloServlet</servlet-name>
<url-pattern>/HelloServlet</url-pattern>
</servlet-mapping>
在通過Eclipse創建Servlet時,會自動在web.xml文件中進行Servlet相關信息的配置
(注意:如果是複製Servlet類文件,需要自己手動添加配置,否則複製的Servlet將無法訪問!)
創建一個Servlet, 就會在web.xml文件中添加兩個標籤:<servlet>和<servlet-mapping>標籤
<servlet>和<servlet-mapping>標籤內的<servlet-name>標籤,內容可以更改,但要求更改後的內容必須一致。
<servlet-class>標籤用於配置Servlet類的全路徑名(即包名+類名)
(注意:如果在創建Servlet後修改了Servlet類的名稱,這裏一定要改,否則將會出現"ClassNotFoundException" 即類找不到異常)
<url-pattern>標籤用於配置瀏覽器以什麼路徑訪問當前Servlet(即Servlet對外訪問的路徑),默認的路徑是:/類名
6.2.3、運行程序進行測試
第一種方法:如果是第一次運行Servlet項目,需要先創建Tomcat服務器
(1)在服務器上右鍵 --> 點擊 "add and remove" 將當前web項目發佈到服務器中,並點擊完成。
(2)啓動tomcat服務器:在服務器上右鍵 Start 即可啓動服務器
(3)打開本地瀏覽器,通過路徑訪問:http://localhost:8080/項目名稱/HelloServlet即可訪問Servlet程序
第二種方法:
1)、在運行的Servlet上點擊右鍵 ---> "Run As" ---> "1 Run on Server"
6.3、Servlet的繼承關係
當瀏覽器訪問一個Servlet時,首先調用Servlet類的service方法(從HttpServlet類中繼承過來的),根據請求方式調用對應的doGet方法或者doPost方法,對請求進行處理!
6.4、Request和Response
request是代表Http請求信息的對象,其中封裝了瀏覽器向服務器發送的請求信息;response對象是代表Http響應信息的對象,其中將會封裝服務器向瀏覽器做出的響應信息。
6.4.1、request
1)、什麼是請求參數
通過瀏覽器向服務器發送請求時,在請求中可以攜帶一些數據,這些數據就稱之爲請求參數
2)、如何獲取參數
request.getParameter(String paramName); -- 通過請求參數的名字,獲取對應的參數值。返回值是一個字符串。
request.getParameterValues(String paramName); -- 通過請求參數的名字,獲取對應的所有參數值組成的數組。
3)、獲取參數時的亂碼問題
Tomcat8.0以後的版本,GET提交方式不涉及亂碼問題
POST提交總會有亂碼,與版本無關,解決方法時在獲取參數的代碼前面加上一行代碼
request.setCharacterEncoding("utf-8");
6.4.2、請求轉發
請求轉發是在服務器端獲取數據的過程中,由訪問的服務器資源跳至另一個資源進行獲取,發生在服務端內部,瀏覽器不知道。
特點:
(1)請求轉發前後是一次請求、一次響應
(2)請求轉發前後,瀏覽器地址欄地址不會發生變化(轉發是服務器內部的跳轉,瀏覽器看不到)
(3)請求轉發前後的request對象是同一個(因爲請求只有一次,服務器根據一次請求,只會創建一個request對象,轉發前後都需要request,所以只能在轉發時,將request對象傳遞給轉發後的那個資源)。
(4)請求轉發只能在同一個web應用內部中的兩個資源之間進行轉發。
即轉發前後的兩個資源必須屬於同一個web應用。
實現方法:
request.getRequestDispatcher("轉發到資源的路徑").forward(req, res);
在進行請求轉發時,request要攜帶數據,此時request作爲域對象使用。
request.setAttribute(String attrName, Object attrValue);
-- 將屬性存入request域中(request對象的map集合裏),其中屬性名只能是字符串,屬性值可以是任意類型。
request.getAttribute(String attrName)
-- 根據屬性名從request域中獲取對應的屬性值。返回值是一個Object。
request域對象的特徵:
生命週期:一次請求開始時,會創建代表請求的request對象,在一次請求結束時(響應已完成),會銷燬request對象。
作用範圍:一次請求範圍內(由於請求轉發前後是一次請求,所以在請求轉發前後可以通過request域帶數據到目的地;如果是重定向,由於重定向前後是兩次請求,request對象也不是同一個,因此在重定向前後不能通過request域帶數據。)
主要功能:帶數據到目的地。
6.4.3、response
向客戶端發送數據
PrintWriter out = response.getWriter();
out.write("hello..");
用字符流發送數據時會出現亂碼,解決方法:
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
out.write("你好");
6.4.4、重定向
訪問資源的路徑發生變化
特點:
(1)重定向前後是兩次請求,兩次響應
(2)重定向前後,瀏覽器的地址欄地址會發生變化。(因爲兩次請求都是通過瀏覽器發起,瀏覽器知道這個跳轉的過程,因此地址欄地址會變化)
(3)重定向前後的request對象不是同一個(因爲重定向前後是兩次請求,服務器根據兩次請求會創建兩個不同的request對象及response對象)
(4)重定向前後的兩個資源可以是來自不同的web應用,甚至可以是來自不同的服務器。(進行跳轉的兩個資源之間沒有限制)
實現方法:
response.sendRedirect("重定向到資源的地址");
7、JSP
7.1、JSP簡介
JSP(全稱JavaServer Pages)是由Sun Microsystems公司主導創建的一種動態網頁技術標準。JSP部署於網絡服務器上,可以響應客戶端發送的請求,並根據請求內容動態地生成HTML、XML或其他格式文檔的Web網頁,然後返回給請求者。JSP技術以Java語言作爲腳本語言,爲用戶的HTTP請求提供服務,並能與服務器上的其它Java程序共同處理複雜的業務需求。
本質上是一個Servlet程序,因爲JSP在第一次被訪問時,會翻譯成一個Servlet程序。
Servlet適合編寫java程序卻不適合輸出一個網頁,所以有了jsp。
7.2、JSP執行過程
訪問JSP的過程爲: 訪問index.jsp --翻譯-> index_jsp.java(Servlet) --編譯-> index_jsp.class(運行) --結果-> 輸出一個網頁到瀏覽器
7.3、JSP語法
7.3.1、模板元素
除了JSP特有的都是模板元素
7.3.2、JSP表達式
格式: <%= 常量/變量/表達式 %>
7.3.3、JSP腳本
格式:<% 若干Java語句 %>
作用:在翻譯後的Servlet中,將腳本片段中的java語句複製粘貼到對應的位置執行
7.3.4、註釋
JSP中註釋有3中,JSP註釋、HTML註釋、Java註釋
JSP註釋在翻譯時直接扔掉,不參與翻譯
Java註釋放在腳本片段中,參與翻譯,但是被java註釋,不會參與執行
HTML註釋當做模板元素髮給瀏覽器,會參與運行,但是不顯示。
7.3.5、JSP指令
指令的格式: <%@ 指令名稱 若干屬性聲明... %>
指令的作用: 用於指揮JSP解析引擎如何將一個JSP翻譯成一個Servlet程序。
<%@ page language="java"%> 指定開發語言
<%@ page import="java.util.Date"%> 導包
<%@ page pageEncoding="UTF-8"%> 指定編碼
以上3個指令可以合在一起放在一個page指令上
7.4、EL表達式
格式: ${ 常量、表達式、變量 }
注意:這裏的變量想要被獲取,必須要存放到域中
${ "Hello EL" } Hello EL
${ 100+123 }
<hr/>
<% //聲明一個name變量,並存入request域中
String name = "林青霞";
request.setAttribute( "n", name );
%>
${ n }
獲取作用域中數組或集合的值
${ ns[0] } <br/>
${ ns[1] } <br/>
${ ns[2] } <br/>
${ ns[3] } <br/>
獲取作用域中map的元素
${ map1.name } <br/>
${ map1.age } <br/>
${ map1.nickname } <br/>
獲取作用域中Javabean對象的屬性
${ user.username } <br/><!-- 底層還是調用getUsername方法 -->
${ user.password } <br/><!-- 底層還是調用getPassword方法 -->
${ user.addr } <br/><!-- 底層還是調用getAddr方法 -->
7.5、Jstl
在使用之前需要:
(1)導入JSTL的開發包
(2)在使用JSTL標籤庫的JSP中引入JSTL
1、<c:set></c:set> 往四大作用域中添加或修改域屬性
<c:set var="name" value="張三" scope="request"/>
${ name }
<c:set var="name" value="張三丰" scope="request"/>
${ name }
(1)var -- 指定存入作用域中的屬性名稱
(2)value -- 指定存入作用域中屬性的值
(3)scope -- 指定將屬性存入哪一個作用域中
可取值: a)page表示pageContext域 b)request表示request域 c)session表示session域 d)application表示ServletContext域
作用域大小:page<request<session<application
2、<c:if></c:if> -- 構造if…else…語句
<c:set var="score" value="-58"/>
<c:if test="${ score<=100 && score > 80 }">
優秀!
</c:if>
test屬性用於指定判斷的條件,注意:JSTL中沒有提供else對應的標籤
3、<c:forEach></c:forEach> 對集合或數組等中元素進行循環遍歷或者是執行指定次數的循環.
遍歷數組
<%
//聲明一個數組, 並將數組存入域中
String[] names = {"王海濤","齊雷","陳子樞"};
request.setAttribute("names", names);
%>
<c:forEach items="${names}" var="name">
${ name }
</c:forEach>
遍歷map
<%
//聲明一個Map, 並將Map存入域中
Map map = new HashMap();
map.put("name", "關羽");
map.put("age", "38");
map.put("addr", "中鼎大廈B座");
request.setAttribute("map", map);
%>
<c:forEach items="${ map }" var="entry">
${ entry.key } : ${ entry.value } <br/>
</c:forEach>
(1)items: 指定需要遍歷的集合或數組
(2)var: 指定用於接收遍歷過程中的元素
(3)begin: 指定循環從哪兒開始
(4)end: 指定循環到哪兒結束
(5)step: 指定循環時的步長, 默認值是1
(6)varStatus: 用於表示循環遍歷狀態信息的對象, 常用屬性有:
first屬性: 表示當前遍歷是否是第一次, 若是, 則返回true;
last屬性: 表示當前遍歷是否是最後一次, 若是, 則返回true;
count屬性: 記錄當前遍歷是第幾次
手過一遍,也是一次小小的回憶知識的過程。