没有合适的资源?快使用搜索试试~ 我知道了~
J2EE WEB技术与实用技巧
需积分: 0 8 下载量 92 浏览量
2009-09-02
09:05:50
上传
评论
收藏 1.08MB PDF 举报
温馨提示
试读
57页
J2EE WEB技术与实用技巧很经典,不看会后悔哦,做软件开发是一定要看的
资源详情
资源评论
资源推荐
J2EE WEB 技术与实用技巧
作为一篇浅显易懂的初级文章。在这里,我们就日常工作中最常使用到的 WEB 界面技术
做一些总结,而不对当前出现的新技术、新理念做探讨。
前言
基于我们工作内容是 J2EE 免不了要和 WEB 打交道,因此我们要有比较强的 WEB 应
用能力。此篇文章正是针对那些对 WEB 端技术不是很熟悉的人群。
此文中,我们将要首先对一些常用的概念、理论进行阐述,包括超文本标记语言(HTML),
脚本语言 Javascript,以及 JSP (主要是 JSTL)和 struts 的 tiles 模板框架;随后,我们将进
入实例的练习,针对我们工作中最常用的内容做一些实例。
§1 HTML 技术
§1.1 概述 (可略)
HTML 的英语意思是:Hypertext Marked Language,即超文本标记语言,是一种用来制作
超文本文档的简单标记语言。超文本传输协议规定了浏览器在运行 HTML 文档时所遵循的规
则和进行的操作.HTTP 协议的制定使浏览器在运行超文本时有了统一的规则和标准.用 HTML
编写的超文本文档称为 HTML 文档,它能独立于各种操作系统平台,自 1990 年以来 HTML 就一
直被用作 WWW(是 World Wide Web 的缩写,也可简写 WEB、中文叫做万维网) 的信息表
示语言,使用 HTML 语言描述的文件,需要通过 WEB 浏览器显示出效果。
所谓超文本,是因为它可以加入图片、声音、动画、影视等内容,事实上每一个 HTML
文档都是一种静态的网页文件,这个文件里面包含了 HTML 指令代码,这些指令代码并不是一
种程序语言,它只是一种排版网页中资料显示位置的标记结构语言,易学易懂,非常简单。
HTML 的普遍应用就是带来了超文本的技术----通过单击鼠标从一个主题跳转到另一个主题,
从一个页面跳转到另一个页面与世界各地主机的文件链接。直接获取相关的主题。
§1.2 HTML 的基本结构
一个 HTML 文档是由一系列的元素和标签组成.元素名不区分大小写.HTML 用标签来规
定元素的属性和它在文件中的位置,HTML 超文本文档分文档头和文档体两部分,在文档头
里,对这个文档进行了一些必要的定义,文档体中才是要显示的各种文档信息。
以下是一个最简单的 HTML 文档示例:
示例 1
<HTML> ---------------------------------------- 开始标签
<HEAD> --------------------------------------
<TITLE> 一个简单的 HTML 示例 </TITLE> | 头部标签
</HEAD> --------------------------------------
<BODY> ----------------------------------------
<CENTER> |
<H1>欢迎光临我的主页</H1> |
<BR> |
<HR> | 文件主体
<FONT SIZE= 7 COLOR= red> |
这是我第一次做主页 |
</FONT> |
</CENTER> |
</BODY> ---------------------------------------
</HTML> --------------------------------------- 结尾标签
§1.3 HTML 标签
<HTML></HTML>在文档的最外层, 文档中的所有文本和 html 标签都包含在其中,它
表示该文档是以超文本标识语言(HTML)编写的。事实上,现在常用的 Web 浏览器都可以
自动识别 HTML 文档,并不要求有 <html>标签,也不对该标签进行任何操作,但是为了使
HTML 文档能够适应不断变化的 Web 浏览器,还是应该养成不省略这对标签的良好习惯。
§1.4 HEAD 标签部分
1)<head></head>
<HEAD></HEAD>是 HTML 文档的头部标签, 在浏览器窗口中,头部信息是不被显示在
正文中的,在此标签中可以插入其它标记, 用以说明文件的标题和整个文件的一些公公属性。
若不需头部信息则可省略此标记,良好的习惯是不省略。
2)<title></title>
<title>和</title>是嵌套在<HEAD>头部标签中的,标签之间的文本是文档标题,它被显
示在浏览器窗口的标题栏。
3)<meta />
meta 是用来在 HTML文档中模拟 HTTP协议的响应头报文。meta 标签用于网页的<head>
与</head>中,meta 标签的用处很多。meta 的属性有两种:name 和 http-equiv。name 属性主
要用于描述网页,对应于 content(网页内容),以便于搜索引擎机器人查找、分类(目前几
乎所有的搜索引擎都使用网上机器人自动查找 meta 值来给网页分类)。这其中最重要的是
description(站点在搜索引擎上的描述)和 keywords(分类关键词),所以应该给每页加一个
meta 值。比较常用的有以下几个:
name 属性
1、<meta name="Generator" content="">用以说明生成工具(如 Microsoft FrontPage
4.0)等;
2、<meta name="KEYWords" content="">向搜索引擎说明你的网页的关键词;
3、<meta name="DEscription" content="">告诉搜索引擎你的站点的主要内容;
4、<meta name="Author" content="你的姓名">告诉搜索引擎你的站点的制作的作者;
5、<meta name="Robots" content= "all|none|index|noindex|follow|nofollow">
其中的属性说明如下:
设定为 all:文件将被检索,且页面上的链接可以被查询;
设定为 none:文件将不被检索,且页面上的链接不可以被查询;
设定为 index:文件将被检索;
设定为 follow:页面上的链接可以被查询;
设定为 noindex:文件将不被检索,但页面上的链接可以被查询;
设定为 nofollow:文件将不被检索,页面上的链接可以被查询。
http-equiv 属性
1、<meta http-equiv="Content-Type" content="text/html";charset=gb_2312-80">
和 <meta http-equiv="Content-Language" content="zh-CN">用以说明主页制作所使用的文
字以及语言;
又如英文是 ISO-8859-1 字符集,还有 BIG5、utf-8、shift-Jis、Euc、Koi8-2 等字符集;
2、<meta http-equiv="Refresh" content="n;url=http://yourlink">定时让网页在指定的时
间 n 内,跳转到页面 http://yourlink;
3、<meta http-equiv="Expires" content="Mon,12 May 2001 00:20:00 GMT">可以用于
设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用 GMT
时间格式;
4、<meta http-equiv="Pragma" content="no-cache">是用于设定禁止浏览器从本地机
的缓存中调阅页面内容,设定后一旦离开网页就无法从 Cache 中再调出;
5、<meta http-equiv="set-cookie" content="Mon,12 May 2001 00:20:00 GMT">cookie
设定,如果网页过期,存盘的 cookie 将被删除。需要注意的也是必须使用 GMT 时间格式;
6、<meta http-equiv="Pics-label" content="">网页等级评定,在 IE 的 internet 选项中
有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过 meta 属性来
设置的;
7、<meta http-equiv="windows-Target" content="_top">强制页面在当前窗口中以独立
页面显示,可以防止自己的网页被别人当作一个 frame 页调用;
8、<meta http-equiv="Page-Enter" content="revealTrans(duration=10,transtion= 50)">和
<meta http-equiv="Page-Exit" content="revealTrans(duration=20,transtion=6)">设定进入和离开
页面时的特殊效果,这个功能即 FrontPage 中的“格式/网页过渡”,不过所加的页面不能够是
一个 frame 页面。
以上内容很多有一些是对网站独有的对我们做系统来说帮助不是很大,比如:<meta
name="KEYWords" content="">,<meta name="DEscription" content="">, meta name="Author"
content="你的姓名">, meta name="robots" content="… ">等,这些内容用于网站对搜索引擎的
友好性方面非常有帮助。
但对我们 J2EE Intranet 系统来说用处不是很大,因为我们用不着被搜索引擎收录,甚至为了
信息的保密性还要防止被搜索引擎收录。对我们有用的就是 http-equiv 属性的内容最常用道
的有 Content-Type 这个内容是必不可少的,即使你在<%@ page contentType=”text/html”
pageEncoding=”…” %>定义过所使用的字符集,那也应该在 head 标签中加上<meta
http-equiv="Content-Type" content="text/html";charset=gbk">; <meta http-equiv="Refresh"
content="n;url=http://yourlink">刷新也是经常用到的,或者我们更多用到的<c:redirect>标签
还有就是禁用缓存 <meta http-equiv="Expires" content="Mon,12 May 2001 00:20:00 GMT" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache" />
4)<link />
5)<script></script>
6)<style></style>
样式标签,用于定义样式(CSS)CSS 全称 Cascaded Style Sheet
§1.5 BODY 部分
1) <BODY></BODY>
<BODY> </BODY>标记一般不省略,标签之间的文本是正文,是在浏览器要显示的页面
内容。上面的这几对标签在文档中都是唯一的,HEAD 标签和 BODY 标签是嵌套在 HTML
标签中的。在<body>和</body>中放置的是页面中所有的内容,如图片、文字、表格、表单、
超链接等设置。
<body>标签有自己的属性,设置 <body>标签内的属性,可控制整个页面的显示方式。
<body>标签的属性
属 性
描 述
link 设定页面默认的连接颜色
alink 设定鼠标正在单击时的连接颜色
vlink 设定访问后连接文字的颜色
background 设定页面背景图像
bgcolor 设定页面背景颜色
leftmargin 设定页面的左边距
topmargin 设定页面的上边距
bgproperties 设定页面背景图像为固定,不随页面的滚动而滚动
text 设定页面文字的颜色
格式:
<body text="#000000" link="#000000" alink="#000000" vlink="#000000"
background="gifnam.gif" bgcolor="#000000" leftmargin=3 topmargin=2 bgproperties="fixed">
示例 2:
<html>
<head>
<title>bady 的属性实例</title>
</head>
<body bgcolor="#FFFFE7" text="#ff0000" link="#3300FF" alink="#FF00FF"
vlink="#9900FF">
<center>
<h2>设定不同的连接颜色</h2>
测试 body 标签<p>
<a href="http://www.baidu.com/">默认的连接颜色</a>
<p>
<a href="http://www.sina.com.cn">正在按下的连接颜色,</a>
<p>
<a href="http://www.sohu.com/">访问过后的连接颜色,</a>
<P>
<a href="#" onClick="javascript:window.history.back()">返回</a>
</conter>
</body>
</html>
实例说明:
<body>的属性设定了页面的背景颜色,文字的颜色,链接的颜色为#3300ff,单击的连接
颜色为#ff00ff,单击过后的颜色为#9900ff。
Body 里面的是页面中的链接标签,对于属性可根据页面的效果来定,用那个属性就设定
那个属性。
2)换行标签<br />
换行标签是个单标签,也叫空标签,不包含任和内容,在 html 文件中的任何位置只要使
用了<br />标签,当文件显示在浏览器中时,该标签之后的内容将显示下一行。
示例 3:
<html>
<head>
<title>无换行示例</title>
</head>
<body>
无换行标记:登鹳雀楼 白日依山尽,黄河入海流。欲穷千里目,更上一层
楼。
<br>有换行标记:<br>登鹳雀楼<br>白日依山尽,<br>黄河入海流。<br>欲
穷千里目,<br>更上一层楼。
</body>
</html>
3)换段落标签<p>
由<p>标签所标识的文字,代表同一个段落的文字。不同段落间的间距等于连续加了两
个换行符,也就是要隔一行空白行,用以区别文字的不同段落。它可以单独使用,也可以成
对使用。单独使用时,下一个<P>的开始就意味着上一个<P>的结束。良好的习惯是成对使用。
格式:
<P>
<P ALIGN= 参数>
其中,ALIGN 是<p>标签的属性,属性有三个参数 left,center,right.这三个参数设置段落文字
剩余56页未读,继续阅读
taige
- 粉丝: 60
- 资源: 25
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论0