java web實例之使用web.xml及index.jsp構造首頁

時間 2019-11-17

標籤 java web 實例使用 web.xml xml index.jsp index jsp 構造首頁欄目 Java 简体版

原文原文鏈接

若有侵權請聯繫刪除

http://www.cnblogs.com/skyblue-li/p/5902712.htmljavascript

/(ㄒoㄒ)/~~因爲是個博客新手，這篇博客以前寫的沒有保存，如今都沒了。好想哭~~~~~html

如今只好重新開頭！！！這個故事告訴咱們：寫完了要保存！！寫完了要保存！！寫完了要保存！！（重要的事要說三遍）前端

最近在導師的指導下看了一點java web前端的內容。就想着爲我可憐的博客數量貢獻一下，所以有了這篇博客(*^__^*) 嘻嘻……java

這篇博客主要是理一下各個文件應該存放的位置，即存放在哪裏才能正常運行，不然不運行。web

完成內容：建立一個網頁首頁，點擊首頁中的相關連接進行跳轉。app

1.建立java web項目

使用eclipse建立一個java web項目，不知道怎麼建立的童鞋請自行百度。不在此多說。此web項目中，有兩個重要的文件夾：一個是src文件夾，用於存放java的.calss文件，另外一個是WebContent文件，用於存放各類jsp等文件。個人web項目的名稱爲FirstWebFontEnd。eclipse

1.1建立index.jsp文件

在建立了web項目後，在WebContent目錄下建立index.jsp文件（同上，不知道怎麼建立jsp文件的請自行百度）。在建立的文件中將「ISO-8859-1「改成「utf-8」，一共有三處。建立好了index.jsp文件後，個人web項目的目錄結構以下圖：jsp

index.jsp中我根據http://www.cnblogs.com/skyblue-li/p/5902712.html作了一個類似的首頁。網頁展現以下圖：ui

index.jsp的代碼以下：具體的代碼不在解釋，我是根據上面的連接作的。不懂請參照連接。url

<%@ 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>首頁</title>
<style>
    *{
    padding:0;
    margin:0;
    font-family:"微軟雅黑";
}
.header{
    height:72px;
    background:#458fce ;
}
.header .logo{
    color:#fff ;
    line-height:70px;
    font-size:30px;
    margin-left:20px;
    display:inline-block;
    text-align:center;

}
a {
    color: #fff ;
    text-decoration: none ;
}
.header .login{
    float:right;
    color:#fff ;
    line-height:72px;
    margin-right:2px;
    display:inline-block;
}
.banner{
    height:380px;
    overflow:hidden;
    background: #ddd;
}
</style>
</head>
<body>
    <div class="header">
        <div class="logo">web實踐</div>
        <div class ="login">
            <a href ="javascript:void(0)">登陸</a>
            <span>|</span> 
            <a href ="javascript:void(0)">故事</a>
        </div>
    </div>
</body>
</html>

web項目是經過web.xml配置來識別index.jsp文件的。web.xml的配置以下：

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>FirstWebFontEnd</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
</web-app>

上述xml文件的意思是系統從上往下挨個檢查上述index.html->index.htm->....文件，找到了就執行相應的文件，沒找到就繼續往下找，直到找到爲止。

另外：http://localhost:8080/FirstWebFontEnd/是web項目的首頁。顯示的就是WebContent目錄下index.jsp文件中的內容（xml從index.html開始查找文件，直到index.jsp才找到相應的文件，從而執行相應的內容，而且再也不往下查找。）若是WebContent目錄下沒有<welcome-file>中包含的全部文件，則會報404的錯誤。

下圖是移除index.jsp文件後的執行效果：

每個web項目在訪問項目名的url時，若是在WebContent下沒有找到相應的文件，則會出現404的錯誤，若是找到了，則執行相應的文件。