如何在JSP页面引入一个JS或者CSS
以下所有的例子中的页面我们设定为a.jsp
方案一，错误的使用相对路径或绝对路径引入
相对路径
<script type="text/javascript" src="js/doctorstation/jquery-1.12.4.min.js"></script> 或者
<script type="text/javascript" src="../js/doctorstation/jquery-1.12.4.min.js"></script>
这种方式其实使用的是相对路径的写法，在你直接访问某个页面的时候比如如下
http://localhost:8081/a.jsp
这种方式没有问题。
但是如果你是通过servlet（或者spring mvc，struts等框架）跳转到此页面的话，比如你定义了一个path为a.do的servlet。你访问的是如下地址
http://localhost:8081/aPage.do
你可能无法正确的引入这个JS。因为你得到的JS的路径可能会在路径前加上你servlet的访问路径，类似如下
http://localhost:8081/aPage/a.js
那么这肯定只能得到一个404.
绝对路径
绝对路径要么是以/开头，要么是以http开头
比如如下两种方式
<script type="text/javascript" src="/js/doctorstation/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="http://abc.com/js/doctorstation/jquery-1.12.4.min.js"></script>
但是以/开头的可能存在问题
你可以在页面上通过此方式来引入JS。他是一种绝对路径的写法。这种写法在你项目部署在tomcat的root下是没有任何问题的，但是当你项目部署在webapp下，也就是存在application context的时候这种方式是存在问题的。比如你的项目为UserDemo。那么这个JS的正确访问路径应该为
http://localhost:8081/UserDemo/a.js
但是你通过上面这种方式你访问路径就会变成
http://localhost:8081/a.js
所以你也会得到一个404
方案二，正确的姿势引入
既然绝对路径以/开头有问题，那么就要试试使用http开头了，这也是目前常用的解决方案。一般这么写。在a.jsp页面引入新的jsp.这个新的jsp我们把它叫mytags.jsp。a.jsp页面引入的地方如下写法
<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@include file="/context/mytags.jsp" %>
<!DOCTYPE html>
<html>
<head>
......
mytags.jsp页面内容如下
<%@ taglib prefix="t" uri="/easyui-tags"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt_rt"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<c:set var="webRoot" value="<%=basePath%>" />
这里的webroot的最终结果就是
http://ip:port/项目名称 比如
http://localhost:8081/UserDemo/ 而如果你是放到tomcat的root目录下 那么是不加项目名的 类似
http://localhost:8081/
这样的话，我们就可以在a.jsp通过以下写法来使用绝对路径来引入JS或者css.例如
<link href="${webRoot}/asset/css/base.css" rel="stylesheet">
上诉翻译过来的真是路径就类似于
http://localhost:8081/asset/css/base.css
这个路径是绝对没有问题的。
这种写法的另一个好处是我们可以把每个页面都需要的js获取类库放到mytags.jsp里面，而不需要每个页面都引入一次。例如这里有一个相对复杂的mytags.jsp
如何把webRoot去掉
对于如上的一个mytags.jsp写法，可以看到每个引入的JS前面都加了${webRoot}。那么有没有什么办法可以省略掉这个呢，答案是有的，JS中提供了一个全局的前缀的写法
你可以在mytags.jsp文件中加入
<base target="_self" href="<%=basePath%>">
它代表每个引入JS的地方都需要加上这个前缀。这样的话下面引入JS的地方就可以省略掉${webRoot}了。但是这种方式在某些情况下回出现问题，比如上诉最下面的My97DatePicker/WdatePicker.js。这个关于日期的插件由于其在内部还引用了其他的JS和CSS且没有做特殊处理，导致在查找这些文件的时候回404.
所以，对于这些我们需要特殊处理一下，即在前面加对应的项目名，也就是request.getContextPath()。由于上诉已经使用ctx定义了request.getContextPath()。所以可以写成如下这样
<script src="${ctx}/assets/plugins/My97DatePicker/WdatePicker.js" type="text/javascript"></script>