【JavaWeb项目】一个众筹网站的开发（三）第一个网页

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了【JavaWeb项目】一个众筹网站的开发（三）第一个网页，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含3521字，纯文字阅读大概需要6分钟。

内容图文

一、bootstrap

本项目采用bootstrap3

bootstrap中文网 https://www.bootcss.com/

使用bootstrap三步：

1.导入jQuery

2.导入bootstrap自己的css样式

3.导入bootstrap自己的js文件

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

bootstrap定义了大量的样式库，要使用样式，只要将元素的class指定为样式库中的值。

二、第一个网页

index.jsp

和css等资源文件一起放在web层的webapp下

新建plugin文件夹，bootstrap放在里面

此时启动项目，发现样式不对

 F12控制台报错

资源路径进行配置

样式在网页推荐写绝对路径 

写监听器

web层创建

 编写监听器

package com.atguigu.scw.manager.listener;

import javax.servlet.ServletContext;
import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;

/**
 * 项目启动时，将一些常用数据放在application域中，大家都能用
 * @ClassName MyAppListener
 * @Description TODO(这里用一句话描述这个类的作用)
 * @version 1.0.0
 */
public class MyAppListener implements ServletContextListener{

    public void contextInitialized(ServletContextEvent sce) {
        ServletContext servletContext = sce.getServletContext();
        //1.将项目放在application域中
        servletContext.setAttribute("ctp", servletContext.getContextPath());
        
    }

    public void contextDestroyed(ServletContextEvent sce) {
        //2.项目关闭，销毁application域中所有数据
        
    }

}

在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_2_5.xsd"
    id="WebApp_ID" version="2.5">
    
    <!-- 启动自己的listener -->
    <listener>
        <listener-class>com.atguigu.scw.manager.listener.MyAppListener</listener-class>
    </listener>
    
    <!-- 启动spring容器 -->
    <!-- needed for ContextLoaderListener -->
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:spring-*.xml</param-value>
    </context-param>

    <!-- Bootstraps the root web application context before servlet initialization -->
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>
    

    <!-- The front controller of this Spring Web application, responsible for 
        handling all application requests -->
    <servlet>
        <servlet-name>springDispatcherServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <!-- Map all requests to the DispatcherServlet for handling -->
    <servlet-mapping>
        <servlet-name>springDispatcherServlet</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>
    
    <!-- 加上字符编码过滤器 -->
    <filter>
        <filter-name>CharacterEncodingFilter</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <!-- 只是指定了编码格式 -->
        <init-param>
            <param-name>encoding</param-name>
            <param-value>utf-8</param-value>
        </init-param>
        <!-- 进行请求乱码解决 -->
        <init-param>
            <param-name>forceRequestEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>forceResponseEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CharacterEncodingFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>


</web-app>

index.jsp中资源的路径都如下面所示，将路径和实际资源位置一一检查

css

 js

 重新运行

网页显示正常

内容总结

以上是互联网集市为您收集整理的【JavaWeb项目】一个众筹网站的开发（三）第一个网页全部内容，希望文章能够帮你解决【JavaWeb项目】一个众筹网站的开发（三）第一个网页所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端