1.学习java Web要学习那些东西?
html/css/javascript /Servelet/jsp/Ajax
2.了解什么是Web应用?
(1)cs即Client/Server。
a.两层的CS软件系统体系架构。Server上安装了数据库,大量的业务逻辑写在了数据库中,是用数据库语言来写的。客户端有少量的业务逻辑,界面。
两层CS流行的原因:开发的效率比较高。
最大的缺点:可移植性差。只要数据库一换,需要重写业务逻辑。由于数据库编程的语言在同数据库之间是有差异的,并且同一个数据库不同版本语言还会有些差异,如果数据库更换了,重写一遍业务逻辑的工作量相当的大。
(2)java流行的原因:主要是因为两层的cs软件系统体系结构可移植性太差,后来的数据库就写很少的业务逻辑,大部分的业务逻辑都写在了应用服务器当中。编写客户端所使用的语言是不限定的。由于应用服务器一般都是用java写的,由于java的可移植性比较好,所以就这样流行起来了。
三层的CS软件系统体系架构。由于Java写了应用服务器,在客户端和服务器之间还有应用服务器,所以是三层的CS。
三层CS的缺点:开发起来有一定的难度。a.客户端和服务器直接需要自定义协议b.开发服务器,需要考虑 网络安全,线程并发等一系列的问题b.可维护性差(升级服务器的同时,还得升级客户端,客户端需要单独维护,所以工作量相当的大)
(3)BS现在主流的软件系统体系架构,浏览器服务器模式。
流行的原因:服务器不用开发了,已经有了标准的Web Server,客户端不用单独开发,浏览器就是客户端。
浏览器和服务器直接通信的协议是:http。
需要做的工作是开放界面,所用的工具是:html,css,javascript。
对于服务器。我们需要在上面写业务逻辑,所使用的工具是severlet和JSP
优势在于开发比较简单,不用专门写协议,客户端不用单独去维护。
3.一个正式的Web项目需要做的工作有如下:
美工做界面。程序员写后台程序,处理业务逻辑,在美工提供的界面的基础上来开发程序。
4.html基础
(1)什么是html。
hypertext markup language 超文本标记语言,是一种用于开发网页的语言,由浏览器解释执行。解释的方式是,将html代码一行行读入内存,在内存中形成一颗DOM树。创建者:Tim berners lee号称Web之父。
(2).html文件的基本结构:
<html>
<head>
<title>
</title>
<!--用于模拟http消息头相当于服务器给浏览器发送了一个消息头-->
<!--比如,以下消息头的作用,是告诉浏览器,返回的是一个html,并且应该以utf-8的编码来显示
该页面-->
<meta http-equiv="content-type"
content="text/html;charset=utf-8">
<!--引入脚本 为什么在页面开发中需要引入脚本呢?-->
<script>
<!--定义样式-->
<style>
<!--引入外部样式-->
<link>
</head> 对页面的显示没有影响,主要作用是标题
<body>
<!--页面显示的数据-->
</body>
</html>
(3)Web开发标准
建议开发一个页面的时候这样开发。页面的结构有html来负责,页面的外观有css来负责,页面的行为有javascript来负责。
(4)重点掌握的5个标记
a._blank:在一个新的空白的窗口中打开url地址所对应的内容。_self:在当前窗口中打开。
<a href="url地址" target="_blank">链接的一个描述</a> /*将url所指的内容在新窗口中打开。*/
b.使用图片作为链接
<a href="feng.html"><img src="图片地址" width="" height="" border=""/></a> /*在feng.html这个页面打开图片*/
c.使用热点
<img ..... usemap="#Map"> /*引用热点,划分区域*/
<map name="Map">
<area shape="rect" coords="407,20,560,77" href="url地址">
<area shape="rect" coords="580,22,734,76" href="url地址">
</map>用map来定义热点
d.使用锚点:在同一个页面直接来跳转。
<a name="top">some data....</a>
<div style="height:900px;"></div>
<a href="#top">to top</a> /*点击to top时,会跳到some data那个地方*/
e.发送email
<a href="mailto:94374465@qq.com"></a> /*这个地址发一下邮件 */
(5)列表
a.无序列表
<ul>
<li><a href="#">item1</a></li>
<li>item2</li>
<li>item3</li>
</ul>
b.有序列表
<ol>
<li a href="#">item1</li>
<li>item2</li>
<li>item3</li>
</ol>
c.列表的嵌套
<ul>
<li a href="#">item1</li>
<ul>
<li>item1</li>
<li>item2</li>
</ul>
<li>item2</li>
</ul>
(6)表格的使用
格式:
<table>
<tr>
<td></td><td></td><td>2000</td>
</tr>
<tr>
<td></td><td></td><td>salary</td>
</tr>
</table>
a.基本使用
<table border="" cellpadding="" cellspacing="" width="">
border值边框 cellpadding单元格是数据直接的距离 cellspacing;单元格直接的距离 align:表示水平位置 left/right/center 默认靠左显示
valign:表示垂直位置 top/middle/bottom
b不规则的表格
clospan:跨列合并
rowspan:跨行合并
c.表格的另一种写法
<table>
<caption>标题</caption>
<thead></thead>
<tfoot></tfoot>
<tbody></tbody>
<tbody></tbody>
</table>
thead:可以有0-1个
tfoot:表脚可以有0-1个
tbody可以有1-n个
d.表格可以嵌套
(7)表单,用于收集用户的信息
<form>
<input type="text"/>
</form>
input标记:
type="text" 文本输入框
type="submit" 提交按钮
type="reset" 重置按钮
type="password" 密码输入框
type="radio" 单选
type="checkbox"多选
type="file" 上传文件 有个要求,需要给form添加一个属性enctype="multipart/form-data"
type="hidden" 隐藏域
非input标记
<textarea>多行文本输入框
<select>下拉列表
(8)框架
a.<frameset><frame> frameset不能够写在body里面,可以嵌套使用
b.<iframe>可以写在body里面,表示嵌套一个子窗口
<frameset rows="20%",*>*表示窗口中剩下的部分。
(9)其他标记
a.行内标记,不单独占一行的标记
<span></span> <strong></strong>
b.块级标记
<h1>.....<h6> ,<table> ,<form>,<p>,<div>
(10)实体
在html页面出现了空格,>,<,& 用相应的实体去替代。
 :空格 >:> << ": '' &: &