怎样使用自定义标签简化 js、css 引入?
国庆将至,工作兴致全无,来总结点项目里平时不起眼干货。
前端引入 js 、css 一般是这样:
<script type="text/javascript" src="webContent 相对路径"></script> <link type="text/css" href="webContent 相对路径" rel="stylesheet"/>
简化后的 js 、css 引入姿势:
<ct:script path="静态资源相对路径"/> <ct:style path="静态资源相对路径"/>
看起来是不是顺眼多了,自定义标签引入文件的方式,好处和扩展点还有很多,且听我慢慢道来。
该自定义标签基于 jsp-api,要没使用过 jsp 的同学,其实也没必要往下翻了,都挺忙的对吧。
1. 继承 TagSupport 设计标签处理类
javax.servlet.jsp.tagext.TagSupport 作为自定义标签核心关注类,实现了 IterationTag、Tag、JspTag 接口。
在实现的这些接口中,有些表示状态的常量需要介绍一下,这样你的理解会更明亮。
int SKIP_BODY = 0; //跳过了开始和结束标签之间的代码
int EVAL_BODY_INCLUDE = 1;//需要处理标签体
int SKIP_PAGE = 5;//忽略剩下的页面
int EVAL_PAGE = 6;//继续输出下面的页面
int EVAL_BODY_AGAIN = 2;//反复执行所处的方法
配上我这活动图、接口方法、接口状态码,应该大体上明白 sun 底层对 jsp 标签整个处理流程了吧。
像 struts 的 <s:> 标签系列、webwork 的<ww:> 标签系列、JSTL 的 <s:> 标签系列等等...都是在上述流程下做的扩展。
好了,底层机制剖析结束,还是回归主题,继承 TagSupport 的自定义标签处理类如下。
public class StyleTag extends TagSupport {
private String path; public StyleTag() {
} public int doEndTag() throws JspException {
JspWriter writer = this.pageContext.getOut();
String contextPath = this.pageContext.getRequest().getServletContext().getContextPath();
try {
if (StrUtil.isNotBlank(path)) {
if (this.path.startsWith("/")) {
writer.write("<link rel='stylesheet' type='text/css' href='" + contextPath + "/static" + this.path + "'/>");
} else
writer.write("<link rel='stylesheet' type='text/css' href='" + this.path + "'/>");
}
} catch (Throwable var9) {
System.out.println("Output style Error:" + var9.getMessage());
} finally {
this.path = null;
}
return TagSupport.EVAL_PAGE;
} //....getter/setter
}
我想做的事情比较简单,这里重写 doEndTag 方法就足够了,实际项目场景涉及复杂,这里就不进行描述了。
2. 编写 tld 标签库定义
当你想在 jsp 页面使用时还需要编写与后端处理类对应的 xml 标签定义。
<?xml version="1.0" encoding="UTF-8"?>
<taglib xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd" version="2.0">
<description>核心标签库</description>
<display-name>Core Tags</display-name>
<tlib-version>1.1</tlib-version>
<short-name>ct</short-name>
<uri>http://com.rambo.spm/core/tags</uri> <tag>
<description>简化js在页面的引入方式</description>
<name>script</name>
<tag-class>com.rambo.spm.core.tag.ScriptTag</tag-class>
<body-content>JSP</body-content>
<attribute>
<description>js相对static的路径</description>
<name>path</name>
<required>true</required>
</attribute>
</tag>
<tag>
<description>简化css在页面的引入方式</description>
<name>style</name>
<tag-class>com.rambo.spm.core.tag.StyleTag</tag-class>
<body-content>JSP</body-content>
<attribute>
<description>css相对static的路径</description>
<name>path</name>
<required>true</required>
</attribute>
</tag>
</taglib>
JSP 中引入方式:(上述标签详细属性和使用方法:http://blog.sina.com.cn/s/blog_76b2c4810101a8so.html)
<!-- 相对路径引入 -->
<%@ taglib prefix="ct" uri="/WEB-INF/tlds/core.tld" %> <!-- 唯一 url 引入 -->
<%@ taglib prefix="ct" uri="http://com.rambo.spm/core/tags" %>
OK,在理解底层的处理流程的前提下,具体项目具体场景都可以进行自定义标签的设计。
设计标签的目的当然是简化前端、整合共有功能、加快项目推进,当然设计的好坏需要项目去沉淀和积累。
怎样使用自定义标签简化 js、css 引入?的更多相关文章
- 标签种类及CSS引入方法
标签种类及CSS引入方法 标签种类: 一:块级标签(block) ——> 独占一行,默认宽度与内容无关,宽高可设 (hr 块级标签) 二:行内块标签(inline-block) ——> ...
- 在jsp页面中使用自定义标签
在某些场景中,自定义标签可封装大量代码,使页面变得更简洁,标签也可以很方便地在不同页面中实现通用而不必去粘贴大量的js代码.现在把最近做的一个自定义标签在这里总结一下.首先总结一下关于自定义标签的一些 ...
- iOS之在webView中引入本地html,image,js,css文件的方法 - sky//////////////////////////////////////ZZZZZZZZZZZZZZZ
iOS之在webView中引入本地html,image,js,css文件的方法 2014-12-08 20:00:16CSDN-sky_2016-点击数:10292 项目需求 最近开发的项 ...
- css js 的引入方式和书写位置
css 的引入方式 1.行内样式 <div id="div1" style="width:100px; height:100px; background:red&q ...
- 【html】【2】html引入外部文件js css
1>引入js 我们只是写了简单必须的html标签,从未给标签添加点击事件,这次页面添加事件. >写入html页面,可以在<head>标签内 也可以在<body>标 ...
- Yii 引入js css jquery 执行操作
在布局中引用通用到js,或者css: <?php Yii::app()->clientScript->registerCoreScript('jquery');?> //注意 ...
- 使用原生js创建自定义标签
使用原生js创建自定义标签 效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- grunt自定义任务——合并压缩css和js
npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...
- 配置springMVC之后,引入js,css等资源处理
配置了sringMVC之后,要引入js,css处理: 做法1:在<%page %>下面增加: <%@ taglib prefix="yesurl" uri=&qu ...
随机推荐
- python专题-Mysql数据库(python3._+ PyMysql)
之前写过一篇 Python使用MySQL数据库的博客,主要使用的是Python2和MySQLdb驱动. python使用mysql数据库 Python2 ---> Python3 MySQLdb ...
- Unity3D安装破解教程(以Unity5.3.4为例)(转)
Unity3D是由Unity Technologies开发的一个让玩家轻松创建诸如三维视频游戏.建筑可视化.实时三维动画等类型互动内容的多平台的综合型游戏开发工具,是一个全面整合的专业游戏引擎.目 ...
- 定时任务之crontab命令
1.简介 crontab用于设置周期性被执行的命令 Linux系统中Linux调动工作分为两大类: 1.系统执行的工作:系统周期性所要执行的工作,如备份系统数据.清理缓存 2.个人执行的工作:某个用户 ...
- JAVA基础第八组(5道题)
36. 37. 38.[程序38] 题目:写一个函数,求一个字符串的长度,在main函数中输入字符串,并输出其长度. package com.niit.homework1; import java.u ...
- JFrame常用属性设置模板
最近在学习Swing,在各种demo中都需要构建JFrame,于是我决定把构建JFrame的代码贴上来,以后就直接复制粘贴了. public static void main(String[] arg ...
- 团队作业4——第一次项目冲刺(Alpha版本)3rd day
一.Daily Scrum Meeting照片 二.燃尽图 三.项目进展 1.界面 界面已初步完成并能够进行简单的界面关联 界面内的功能正在完善 2.登陆方面 QQ授权已申请,等待通过 申请通过后在登 ...
- 201521123113《Java程序设计》第7周学习总结
1. 本周学习总结 2. 书面作业 Q1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 contains源代码: public boolean contains( ...
- 201521123056 《Java程序设计》第6周学习总结
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 注1:关键词与内容不求多,但概念之间的联系要清晰,内容覆盖 ...
- 201521123112《Java程序设计》第1周学习总结
1.本周学习总结 本周通过面授课和上机课,以及在课后通过对<Java学习笔记>前一二章的阅读,初步了解了Java在计算机领域中的重要性,以及Java为什么能够这么广泛的运用在编程中.通过上 ...
- SVN不出现绿色对勾的情况
就目前而言,我出现了两种情况. Num1:电脑云盘可能不兼容,导致无法出现svn提示小icon:----->删除云盘重新启动. Num2:被设置覆盖.----->鼠标右键-->Tor ...