jsp项目web实战

来源：互联网发布：ps mac 2017中文zh cn 编辑：程序博客网时间：2024/06/05 08:31

1、开头最好指定下

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

防止乱码

2、当然公共的html标签，如meta等，可以单独放一文件里

<%@ page contentType="text/html;charset=UTF-8" language="java" %><%    String path = request.getContextPath();    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";%><base href="<%=basePath%>"/><meta http-equiv="Content-Type" charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"><link href="common/site-logo.ico" rel="shortcut icon"/>

basePath来指定路径，防止后期路径的更改

3、公共库的引用也可另外用一个文件装着

<script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript" src="bootstrap.min.js" ></script><link href="bootstrap.min.css" type="text/css" rel="stylesheet"/>

4、对于头部，菜单等复用的，可以单独建jsp来引pageHead

<div class="header"><ul class="topNav">    <li >        首页    </li>    <li>        详情    </li></div>

5、正式用的时候操作如下

<html><head>    <jsp:include page="/htmlHead.jsp"/> </head> <body> <div class="pageHeader">        <jsp:include page="/pageHeader.jsp"></jsp:include>    </div> </body>

来引入刚创建的html头文件和要复用的菜单头文件

补充一下，经常会用到ajax请求页面的方式，a页面切换到b页面
可以这么来写

a页面内容

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <style>        main{            padding:0 20px;        }        .content{            background-color: green;            height: 500px;        }        .other{            background-color: red;            height: 800px;        }    </style></head><body><header>    头部</header><main id="main">    <div class="content">    </div></main><input type="button" value="切换" onclick="loadPage('b.html')"></body></html><script src="jquery.min.js"></script><script>    function loadPage(url,callback){        return $.get(url,function(res){            $('#main').html(res);            callback&&callback(res);        })    }</script>

要切换的b页面内容

<div class="other">    byemina</div><input type="button" value="切换" onclick="loadPage('a.html')">

结果如下
启动服务，显示a页面内容

这里写图片描述

然后点击切换，看b页面内容

注意看地址没变

就简单说这么多了，由于在上班，写的比较抽象，但应该好懂
:-)

阅读全文

2 0