主頁 > 前端設計 > Java程式設計基礎筆記 • 【第2章 JSP基礎】

Java程式設計基礎筆記 • 【第2章 JSP基礎】

2021-02-25 11:45:29 前端設計

全部章節 >>>>


本章目錄

2.1 JSP 簡介

2.1.1 JSP 概述

2.1.2 開發第一個 JSP 頁面

2.1.3 JSP 處理流程

2.1.4 實踐練習

2.2 JSP 指令標識

2.2.1 JSP指令

2.2.2 指令標識

2.2.3 include 指令

2.2.4 taglib指令

2.2.5 實踐練習

2.3 JSP 腳本標識

2.3.1 宣告標識

2.3.2 JSP 運算式

2.3.3 Scriptlet 腳本程式

2.3.4 實踐練習

2.4 注釋標識

2.4.1 JSP 注釋

2.4.2 綜合案例

2.4.3 實踐練習

總結:


2.1 JSP 簡介

2.1.1 JSP 概述

Java Server Page 簡稱 JSP,是由 Sun 公司倡導建立的一種動態網頁技術標準,用于開發動態網頁

JSP就是將傳統Java代碼嵌入到Html頁面代碼中,由Web服務器進行編譯執行,生成最終的靜態Html回傳客戶端

JSP優點:

  • 跨平臺
  • 安全
  • 擴展性
  • 伸縮性強
  • 可重用性

2.1.2 開發第一個 JSP 頁面

JSP 是動態網頁,頁面內不僅包含 HTML 代碼,還包含 Java 代碼,使用Eclipse可以創建Jsp頁面

  • 在Eclipse的Javaweb專案WebContent下,新建Jsp File
  • 輸入檔案名

示例:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/
html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>First JSP page</title>
</head>
<body>
<h1> 這是第一個 JSP 頁面 </h1>
</body>
</html>

Jsp頁面頭部指令標識:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

將專案部署在Tomcat服務器中,啟動服務器,測驗訪問JSP頁面

注意:啟動服務器時注意觀察控制臺輸出資訊,確保無例外發生

2.1.3 JSP 處理流程

瀏覽器無法直接運行JSP檔案,只有將包含JSP檔案的Web專案部署到Web服務器上,才能看到JSP的顯示效果

當客戶端瀏覽器向服務器發出請求訪問一個JSP頁面后,服務器根據該請求加載相應的JSP 頁面,并對該頁面進行轉換、編譯和執行

2.1.4 實踐練習

2.2 JSP 指令標識

2.2.1 JSP指令

JSP 頁面就是帶有 JSP 元素的常規 Web 頁面,它由靜態內容和動態內容構成

其中動態內容包括以下幾種:

  • 指令標識
  • 腳本標識
  • 注釋標識

2.2.2 指令標識

指令標識主要用于設定在整個 JSP 頁面范圍內都有效的相關設定資訊,它是被服務器解釋并執行的,不會產生任何內容輸出到網頁中

<%@ 指令名?屬性 1=“屬性值 1”?屬性 2=“屬性值 2”...%>

(1)指令名:用于指定指令名稱,在 JSP 中包含 page、include 和 taglib 3 個指令,

(2)屬性:用于指定屬性名稱,不同的指令包含不同的屬性,在一個指令中,可以設定多個屬性,屬性之間用逗號或空格隔開,

(3)屬性值:用戶指定屬性值,

示例:

<%@page language=“java” contentType=“text/html” charset=“UTF-8” pageEncoding=“UTF-8”%>

language 屬性,該屬性用于設定 JSP 頁面使用的語言,該屬性的默認值為 Java

import 屬性,該屬性用于設定 JSP 匯入的類包,在 JSP 頁面中匯入類包的代碼片段,如 <%@page import=“java.util.*”%>

pageEncoding 屬性,用于設定 JSP 頁面的編碼格式,即指定頁面編碼,支持中文一般設定為GBK或UTF-8

contentType 屬性,該屬性用于設定 JSP 頁面的 MIME 型別和字符編碼,瀏覽器會根據 contentType 中指定的 MIME 型別和字符集編碼來顯示 JSP 輸出的內容,常見MIME格式如下

MIME

作用

application/msword

Word 檔案

application/pdf

PDF檔案

audio/x-wav

Wav 格式的音頻檔案

text/html

HTML 格式

text/plain

普通檔案

image/jpeg

JPEG 格式

2.2.3 include 指令

include 指令可以在一個 JSP 頁面中包含另一個頁面,常用于多頁面共同的部分抽離出來(如頂部導航、底部著作權等),使用時直接參考,以提升開發維護效率

格式:<%@include file=“包含檔案路徑”%>

示例:將網站網頁頭部導航條和網頁底部著作權資訊欄,包含在主頁面內

top.jsp設計頂部導航等資訊

<%@include file="nav.jsp"%>

copyright.jsp設計底部著作權資訊

 <%@ include file="copyright.jsp"%>

Index.jsp首頁包含top.jsp和copyright.jsp

<body>

	<%@include file="nav.jsp"%>
        首頁自身代碼省略……
    <%@ include file="copyright.jsp"%>

</body>

注意:在應用 include 指令包含檔案時,為使整個頁面的層次結果不發生沖突,應將被包含頁面中的 <html> 元素和 <body> 元素洗掉,因為包含該頁面的檔案中已經指定了這些標記

2.2.4 taglib指令

在 JSP 檔案中,可以通過 taglib 指令宣告該頁面中所使用的標簽庫,同時參考標簽庫,并指定標簽前綴,在頁面中參考標簽庫后,就可以通過前綴參考標簽庫中的標簽

<%@taglib?prefix=“c”?uri=“http://java.sun.com/jsp/jstl/core” %>

2.2.5 實踐練習

2.3 JSP 腳本標識

2.3.1 宣告標識

宣告標識用于在 JSP 頁面中定義全域的變數或方法,通常使用該標識定義整個 JSP 頁面需要參考的變數或方法

語法:

<%! 宣告變數或方法代碼 %>

注意:

<% 與 ! 之間不可以有空格,但是 ! 與其后的代碼之間可以有空格,

<%! 與 %> 可以不在同一行,如下面的格式也是正確的:

<%!  

    宣告變數或方法的代碼 
%>

示例:宣告標識宣告一個全域變數和全域方法,用來統計頁面的訪問次數,

<%!
	int number = 0;// 宣告全域變數
	int count() {
		number++;//number 自增
		return number;
	}%>
<p class="title1">
<span class="fl"> 這是第 <%=count()%> 次訪問該頁面
</span>
</p>

2.3.2 JSP 運算式

示例:宣告標識宣告一個全域變數和全域方法,用來統計頁面的訪問次數,

<ul class="dian">
<%
String paint01 = " 夏塘清趣 ";//腳本用于宣告變數
String paint02 = " 事茗圖 ";
String paint03 = " 漁父圖 ";
 %>
<li><a href="#"><%=paint01%></a></li>//運算式用于輸出結果到網頁上
<li><a href="#"><%=paint02%></a></li>
<li><a href="#"><%=paint03%></a></li>
</ul>

2.3.3 Scriptlet 腳本程式

Scriptlet(代碼片段)腳本程式,是在 JSP 頁面中嵌入的 Java 代碼或腳本代碼

  • 代碼片段將在頁面請求的處理期間被執行,通過 Java 代碼可以定義變數或流程控制陳述句等

語法:

<% 運算式或者變數名 %>
  • 注意<%后面沒有任何符號標志
  • 腳本中的代碼必須符合java語法規范

示例:使用 JSP 腳本定義變數資訊

<ul class="dian">
<%
String paint01 = " 夏塘清趣 ";//腳本用于宣告變數
String paint02 = " 事茗圖 ";
String paint03 = " 漁父圖 ";
 %>
<li><a href="#"><%=paint01%></a></li>//運算式用于輸出結果到網頁上
<li><a href="#"><%=paint02%></a></li>
<li><a href="#"><%=paint03%></a></li>
</ul>

說明:

  • 通過宣告標識創建的變數和方法,生命周期是從創建開始到服務器關閉結束;而腳本片段創建的變數和代碼,其生命周期在頁面關閉后,就會被銷毀
  • 腳本一般用于宣告變數、計算、邏輯判斷及回圈控制,而運算式則僅用于輸出內容

2.3.4 實踐練習

2.4 注釋標識

2.4.1 JSP 注釋

注釋用于對某些代碼做功能性的說明,從而增加程式的可讀性,JSP 程式中可以包含 3 種不同型別的注釋

1、JSP 標準注釋

<%--?JSP標準注釋?--%>
JSP標準注釋在客戶端瀏覽器無法查看到

2、Java 注釋

<%
       //Java單行注釋
       /*
           Java多行注釋
       */
%>
Java注釋在客戶端瀏覽器中也無法看到

3、HTML 注釋

<!--?HTML網頁注釋?-->
HTML網頁注釋在客戶端瀏覽器可以看到

2.4.2 綜合案例

示例:新聞展示頁面制作,使用注釋完成代碼說明:

<ul class="jiantou">
<%
        //呼叫宣告的方法,得到資料,準備回圈
        List<String> paintList = getList();
        for (int i = 0; i < paintList.size(); i++) {
%>
        <li><a href="#"><%=paintList.get(i)%></a></li>
<%
}
%>
</ul>

新聞展示頁面制作,運行結果圖

2.4.3 實踐練習

總結:

  • Java Server Page 簡稱 JSP,是一種在Html中嵌入Java代碼的動態網頁技術,具有跨平臺、安全、重用性強等優點
  • 客戶端通過瀏覽器訪問Web服務器中的Jsp頁面時,服務器會將Jsp進行轉換、編譯、執行,最侄訓傳給客戶端生成的靜態Html代碼頁面
  • Jsp中嵌入Java代碼時可以通過宣告、腳本、運算式幾種不同的方式
  • Jsp頁面中的注釋有Jsp標準注釋、Java注釋及Html注釋幾種

轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/263470.html

標籤:其他

上一篇:[css] 說下line-height三種賦值方式有何區別?

下一篇:VUE入門+5個小案例

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • vue移動端上拉加載

    可能做得過于簡單或者比較low,請各位大佬留情,一起探討技術 ......

    uj5u.com 2020-09-10 04:38:07 more
  • 優美網站首頁,頂部多層導航

    一個個人用的瀏覽器首頁,可以把一下常用的網站放在這里,平常打開會比較方便。 第一步,HTML代碼 <script src=https://www.cnblogs.com/szharf/p/"js/jquery-3.4.1.min.js"></script> <div id="navigate"> <ul> <li class="labels labels_1"> ......

    uj5u.com 2020-09-10 04:38:47 more
  • 頁面為要加<!DOCTYPE html>

    最近因為寫一個js函式,需要用到$(window).height(); 由于手寫demo的時候,過于自信,其實對前端方面的認識也不夠體系,用文本檔案直接敲出來的html代碼,第一行沒有加上<!DOCTYPE html> 導致了$(window).height();的結果直接是整個document的高 ......

    uj5u.com 2020-09-10 04:38:52 more
  • WordPress網站程式手動升級要做好資料備份

    WordPress博客網站程式在進行升級前,必須要做好網站資料的備份,這個問題良家佐言是遇見過的;在剛開始接觸WordPress博客程式的時候,因為升級問題和博客網站的修改的一些嘗試,良家佐言是吃盡了苦頭。因為購買的是西部數碼的空間和域名,每當佐言把自己的WordPress博客網站搞到一塌糊涂的時候 ......

    uj5u.com 2020-09-10 04:39:30 more
  • WordPress程式不能升級為5.4.2版本的原因

    WordPress是一款個人博客系統,受到英文博客愛好者和中文博客愛好者的追捧,并逐步演化成一款內容管理系統軟體;它是使用PHP語言和MySQL資料庫開發的,用戶可以在支持PHP和MySQL資料庫的服務器上使用自己的博客。每一次WordPress程式的更新,就會牽動無數WordPress愛好者的心, ......

    uj5u.com 2020-09-10 04:39:49 more
  • 使用CSS3的偽元素進行首字母下沉和首行改變樣式

    網頁中常見的一種效果,首字改變樣式或者首行改變樣式,效果如下圖。 代碼: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ......

    uj5u.com 2020-09-10 04:40:09 more
  • 關于a標簽的講解

    什么是a標簽? <a> 標簽定義超鏈接,用于從一個頁面鏈接到另一個頁面。 <a> 元素最重要的屬性是 href 屬性,它指定鏈接的目標。 a標簽的語法格式:<a href=https://www.cnblogs.com/summerxbc/p/"指定要跳轉的目標界面的鏈接">需要展示給用戶看見的內容</a> a標簽 在所有瀏覽器中,鏈接的默認外觀如下: 未被訪問的鏈接帶 ......

    uj5u.com 2020-09-10 04:40:11 more
  • 前端輪播圖

    在需要輪播的頁面是引入swiper.min.js和swiper.min.css swiper.min.js地址: 鏈接:https://pan.baidu.com/s/15Uh516YHa4CV3X-RyjEIWw 提取碼:4aks swiper.min.css地址 鏈接:https://pan.b ......

    uj5u.com 2020-09-10 04:40:13 more
  • 如何設定html中的背景圖片(全屏顯示,且不拉伸)

    1 <style>2 body{background-image:url(https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture); 3 background-size:cover;background ......

    uj5u.com 2020-09-10 04:40:16 more
  • Java學習——HTML詳解(上)

    HTML詳解 初識HTML Hyper Text Markup Language(超文本標記語言) 1 <!--DOCTYPE:告訴瀏覽器我們要使用什么規范--> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <!--meta 描述性的標簽,描述一些 ......

    uj5u.com 2020-09-10 04:40:33 more
最新发布
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 07:59:23 more
  • 生產事故-走近科學之消失的JWT

    入職多年,面對生產環境,盡管都是小心翼翼,慎之又慎,還是難免捅出簍子。輕則滿頭大汗,面紅耳赤。重則系統停擺,損失資金。每一個生產事故的背后,都是寶貴的經驗和教訓,都是專案成員的血淚史。為了更好地防范和遏制今后的各類事故,特開此專題,長期更新和記錄大大小小的各類事故。有些是親身經歷,有些是經人耳傳口授 ......

    uj5u.com 2023-04-18 07:55:04 more
  • 記錄--Canvas實作打飛字游戲

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 打開游戲界面,看到一個畫面簡潔、卻又富有挑戰性的游戲。螢屏上,有一個白色的矩形框,里面不斷下落著各種單詞,而我需要迅速地輸入這些單詞。如果我輸入的單詞與螢屏上的單詞匹配,那么我就可以獲得得分;如果我輸入的單詞錯誤或者時間過長,那么我就會輸 ......

    uj5u.com 2023-04-04 08:35:30 more
  • 了解 HTTP 看這一篇就夠

    在學習網路之前,了解它的歷史能夠幫助我們明白為何它會發展為如今這個樣子,引發探究網路的興趣。下面的這張圖片就展示了“互聯網”誕生至今的發展歷程。 ......

    uj5u.com 2023-03-16 11:00:15 more
  • 藍牙-低功耗中心設備

    //11.開啟藍牙配接器 openBluetoothAdapter //21.開始搜索藍牙設備 startBluetoothDevicesDiscovery //31.開啟監聽搜索藍牙設備 onBluetoothDeviceFound //30.停止監聽搜索藍牙設備 offBluetoothDevi ......

    uj5u.com 2023-03-15 09:06:45 more
  • canvas畫板(滑鼠和觸摸)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>canves</title> <style> #canvas { cursor:url(../images/pen.png),crosshair; } #canvasdiv{ bo ......

    uj5u.com 2023-02-15 08:56:31 more
  • 手機端H5 實作自定義拍照界面

    手機端 H5 實作自定義拍照界面也可以使用 MediaDevices API 和 <video> 標簽來實作,和在桌面端做法基本一致。 首先,使用 MediaDevices.getUserMedia() 方法獲取攝像頭媒體流,并將其傳遞給 <video> 標簽進行渲染。 接著,使用 HTML 的 < ......

    uj5u.com 2023-01-12 07:58:22 more
  • 記錄--短視頻滑動播放在 H5 下的實作

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 短視頻已經無數不在了,但是主體還是使用 app 來承載的。本文講述 H5 如何實作 app 的視頻滑動體驗。 無聲勝有聲,一圖頂百辯,且看下圖: 網址鏈接(需在微信或者手Q中瀏覽) 從上圖可以看到,我們主要實作的功能也是本文要講解的有: ......

    uj5u.com 2023-01-04 07:29:05 more
  • 一文讀懂 HTTP/1 HTTP/2 HTTP/3

    從 1989 年萬維網(www)誕生,HTTP(HyperText Transfer Protocol)經歷了眾多版本迭代,WebSocket 也在期間萌芽。1991 年 HTTP0.9 被發明。1996 年出現了 HTTP1.0。2015 年 HTTP2 正式發布。2020 年 HTTP3 或能正... ......

    uj5u.com 2022-12-24 06:56:02 more
  • 【HTML基礎篇002】HTML之form表單超詳解

    ??一、form表單是什么

    ??二、form表單的屬性

    ??三、input中的各種Type屬性值

    ??四、標簽 ......

    uj5u.com 2022-12-18 07:17:06 more