html - 无法在 JSP 中包含 css 和 js 引用

标签 html css jsp tomcat7 eclipse-juno

我正在尝试将 css 和 js 引用库添加到 jsp 页面中,但出现错误 404: file not found

我尝试了各种网站和帖子中提供的许多不同方法,但无法解决问题。

这是元素结构:

enter image description here

我的 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" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" 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>SchoolERP</display-name>

    <servlet>
        <servlet-name>SchoolERP</servlet-name>
        <servlet-class>com.rms.school.controllers.ControllerHome</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>SchoolERP</servlet-name>
        <url-pattern>/ERP</url-pattern>
    </servlet-mapping>

    <welcome-file-list>
        <welcome-file>ERP</welcome-file>
    </welcome-file-list>

</web-app>

主 servlet ControllerHome.java 包含以下代码:

@WebServlet({ "/", "/home" })
public class ControllerHome extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        RequestDispatcher rd = request.getRequestDispatcher("jsp/template.jsp");
        request.setAttribute("content_page", "welcome.jsp");
        rd.forward(request, response);

    }
}

header.jsp文件包含以下代码:

<%@page import="com.rms.school.utils.Config"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>

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

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<%
String title = request.getParameter("title");
if(title==null){
    title = "Untitled";
}%>
<title>
<%=title %>
</title>
<link href="${pageContext.request.contextPath}/css/bootstrap.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/bootstrap-theme.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/ndt-custom.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/menu-styles.css" rel="stylesheet" type="text/css"/>

<!-- HTML5 shim for IE backword compatibility-->
    <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
        </script>
    <![endif]-->
</head>

<body>

welcome.jsp 是包含以下代码的简单文件:

<h1>WELCOME !</h1>

jsp/include 文件夹中的 footer.jsp 包含 bodyhtml 的所有结束标记。

我也尝试使用标签库包含文件。但是问题还是没有解决。

当我在 http://localhost:8080/SchoolERP/ 看到输出页面时,它在 firebug 中给出的错误是:

"NetworkError: 404 Not Found - http://localhost:8080/SchoolERP/css/bootstrap.css"

页面源代码显示head部分如下:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<title>
Untitled
</title>
<link href="/SchoolERP/css/bootstrap.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/bootstrap-theme.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/ndt-custom.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/menu-styles.css" rel="stylesheet" type="text/css"/>

<!-- HTML5 shim for IE backword compatibility-->
    <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
        </script>
    <![endif]-->
</head>

当我点击此来源中的文件链接时,出现错误:

enter image description here

请帮助我知道我在哪里做错了什么。

提前致谢。

最佳答案

经过长时间的搜索和尝试,我们终于找到了问题的根本原因...

servlet 类 @WebServlet({ "/", "/home"}) 上面的注解实际上是导致问题的原因。我刚刚删除它,问题就解决了。

事实上,这个注释不是必需的,因为它已经作为 web.xml 的一部分添加了。

关于html - 无法在 JSP 中包含 css 和 js 引用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29602100/

相关文章:

javascript - 使用 React 使整个 div 表现为复选框

css - 如何获取 Tumblr 帖子网格布局?

css - 滚动不工作 : react-grid-layout: 0-showcase example

java - 是否有可能在 Intellij 的单独选项卡/部分中打开一段代码?

java - JSP 中的 Veracode 问题

javascript - 合并JSP表中的重复行

html - font-awesome的路径结构

javascript - 在 Canvas 元素中旋转和移动图像?

javascript - 是否可以从 Html 本地存储输出到 .csv 或类似文件?

javascript - 流畅的滚动页面