您的位置：首页 > Web前端 > CSS

ftl文件引入css，js

2017-11-20 18:49 477 查看

ftl引入css，js

>文件结构一览

>jar包一览

>web.xml

关键一句话，就是springmvc的那个servlet，因为要用RESTFul风格，所以拦截/,并且让它去读springMVC来初始化(java /src 根路径)。

<?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">
<display-name>justforfun</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
</welcome-file-list>

<servlet>
<servlet-name>springMVC</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>
<servlet-mapping>
<servlet-name>springMVC</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>

[/code]

>springMVC.xml

配置ftl config和viewResolver都是网上找的，直接copy过去，关键是mvc:resources，后面的location注意要放到可以被访问的地方（tomcat中WEB-INF下的东东貌似别人是访问不到的）,spring的问档中说可以放在跟目录下或者神马著名的可被访问的目录(好像应该这么翻译)META-INF.

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:tx="http://www.springframework.org/schema/tx"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.0.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.0.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd"> 
<!-- 自动扫描的包名 -->
<context:component-scan base-package="com.app,com.core,JUnit4"></context:component-scan>

<!-- 默认的注解映射的支持 -->
<mvc:annotation-driven />

<!-- freemarker config -->
<bean id="freemarkerConfig"
class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
<property name="templateLoaderPath" value="/WEB-INF/ftl/" />
</bean>

<!-- View resolvers can also be configured with ResourceBundles or XML files.
If you need different view resolving based on Locale, you have to use the
resource bundle resolver. -->
<bean id="viewResolver"
class="org.springframework.web.servlet.view.freemarker.FreeMarkerViewResolver">
<property name="cache" value="true" />
<property name="prefix" value="" />
<property name="suffix" value=".ftl" />
<property name="contentType" value="text/html; charset=UTF-8"/>
</bean>

<!-- 拦截器 -->
<!-- <mvc:interceptors> <bean class="com.core.mvc.MyInteceptor" /> </mvc:interceptors> -->
<!-- 对静态资源文件的访问 方案一 （二选一） -->
<!-- <mvc:default-servlet-handler /> -->

<!-- 对静态资源文件的访问 方案二 （二选一） -->
<mvc:resources mapping="/images/**" location="/META-INF/resources/images/"
cache-period="31556926" />
<mvc:resources mapping="/js/**" location="/META-INF/resources/js/"
cache-period="31556926" />
<mvc:resources mapping="/css/**" location="/META-INF/resources/css/"
cache-period="31556926" />

[/code]

>ftl文件

导入spring.ftl是为了获得一个路径，@s.url,这个东东会自动加上你工程的名字，例如s.url '/css/default.css'/,会变成justforfun/css/default.css,千万注意！！！

script一定不能写成<script
某某某 />，应该写成<script 某某某></script>

,要不然这行后面的东西在html里面都解析不到了，被这个纠结了好久，不知道为神马，希望大牛看到能告知告知。

<#import "spring.ftl" as s />
<!DOCTYPE>
<html>
<head>
<title>
首页
</title>
<link rel="stylesheet" type="text/css" href="<@s.url '/css/default.css'/>"/>
<script type="text/javascript" src="<@s.url '/js/jquery.min.js'/>">
</script>
</head>
<body>
<h1>
首页的试炼
</h1>
<div>
bingo!
<img src = "<@s.url '/images/img1.jpg'/>"/>
</div>
</body>

[/code]

>spring的controller

这个仅仅返回index就好了。

package com.app.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

@Controller
@RequestMapping("/")
public class IndexController {

@RequestMapping(method=RequestMethod.GET)
public String index(){
return "index";
}

[/code]
}

>最终效果

可以见到，图片，css，js，都没问题，而且因为springMVC里面设置了UTF-8，所以显示的是中文而不是乱码。

ps,增强你的效率vimer

找到了一个老哥配置的gvim，非常不错，在eclipse里面可以用viplugin这个插件，在环境变量里面加入vim的路径，:vim即可直接启用vim编辑，美中不足的是没有加上command-T这个插件，因为用ruby，windows下各种不成功，可惜。linux下推荐janus这个vim插件管理器很好很强大，而且command-T也默认安装了，:help janus有很大惊喜另外，用zsh吧，好好配置一下，它的tab功能比bash强好多。
http://www.codeweblog.com/code/snippet_574132_13357

pps 为什么上面图片不显示？？？

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航