Java网页设计基础.ppt

Java技术与应用 网页设计基础 第10章 西安交大卫颜俊2009年5月电子信箱 Mr Java QQ 610568018网站 202 117 58 97 java 主要内容 Tomcat配置HTML语言介绍JavaScript语言介绍 Tomcat的配置 HTML网页设计语言简介 HypertextMarkupLanguage 即超文本标记语言用于创建便于平台移植的超文本文档的一种简单标记语言主要用于WEB应用中SGML的一种简化版HTML文件是带有格式标识符和超文本链接的内嵌代码的ASCII文本文件 文件后缀为 htm或 html 一般由浏览器使用HTTP HypertextTransferProtocol 网络协议下载 解释和运行目前有许多诸如FrontPage DreamWeaver和CoffeeCup等智能化的网页制作软件专门用来制作HTML文件通常不需要人工去写大量代码 典型的HTML文档的层次 包括 结构 内容和样式HTML对结构和内容之间的关系进行表示和处理结构用于描述文档的组织结构 内容包括信息标题 段落 项目列表和表格中的具体内容 各个内容使用开始和结束标记区分 样式定义内容的样式设置标准 基本语法 1 HTML文件总体结构 页面配置 背景色彩 背景图象 链接 2 字体 标题字体 其中 可以是1 7普通字体 字体大小 其中 可以是1 7或 字体颜色 物理字体 粗体 斜体 带下划线逻辑字体 虚化 加重 3 文字布局 段 换行 不换行 文字的对齐align 其中 为left center right无序列表 有序列表 定义列表 保持原貌 闪烁 3 图象 其中 为图象文件的URL 其中 为边的宽度 例10 1 基本网页例子 表格 定义表格 定义表行 定义表头 定义表元 表格的具体数据 在中还可以通过一些属性定义表格的边框 宽度 高度和间隔数等 在中可以定义占多行 占多列 背景颜色或等属性 例10 2 精彩赛事推荐 表单 1 简单表单 其中 action 后的 为提交目的网址 method 后的 可以是GET或POST 表示提交表单的方式 type 后的 为输入形式 可以是text password checkbox radio image hidden submit或reset之一 name 后的 为变量名字 value 后的 为初始值 对于image还可以有src 属性表示图片网址 另外 对于text password还可以有size 和maxlength 属性 分别表示输入的字符宽度和最大宽度 对于checkbox radio还可以有checked属性 表示初始选中 对于image还可以有src 属性表示图片网址 2 列表框 其中 的属性name 后的 为变量名字 size 后的 为字符宽度 的属性selected表示初始选中 value 后的 为初始值 multiple表示可以多选 3 文本区域 其中 name 后的 为变量名字 rows 后的 为行数 cols 后的 为列数 例10 3 注册单 JavaScript语言简介 最早由Netscape公司开发 是一种嵌入在HTML文件中的描述语言 为了增强浏览器功能 一种介于Java与HTML之间的 基于对象和事件驱动的程序设计语言 是Java的简化和HTML的加强 使得信息和用户之间不但具有显示和浏览的关系 而且实现了它们之间的实时动态的交互表达能力 程序可以在客户端首先完成输入的表单等资料的验证工作 之后再递交给Web服务器处理和保存 这样大大减少了网络传输的次数 JavaScript的基本特点 解释性脚本语言基于对象的语言简单性安全性动态性的跨平台性 与Java的区别 基于对象和面向对象解释和编译强变量和弱变量代码格式不一样嵌入方式不一样静态联编和动态联编 基本语法 JavaScript语言中具有普通计算机语言所具有的典型要素 包括数据类型 常量变量表达式 控制结构 数字 字符串 函数 对象和事件等 非常接近于Java语言JavaScript语言代码 JavaScript语言代码 窗口及输入输出 JavaScript的输入输出是通过对象来完成的其中 输入可通过窗口 window 对象来完成输出可通过文档 document 对象的方法来实现 window prompt 提示信息 默认值 window confirm 提示信息 默认值 window alert 内容 window open 网址 窗口名字 窗口属性 document write 内容 或document writeln 内容 document open URL 窗口名字 窗口属性 关闭文档流document close 清除文档内容document clear 函数 function函数名 参数表 变元表 函数体代码 return表达式 例10 4 计算费波那契数列的第n项和前n项之和 事件 1 单击事件onClickbutton 按钮 checkbox 复选框 radio 单选钮 reset 复位按钮 和submit 提交按钮 2 改变事件onChangetext或textarea元素 事件 3 选中事件onSelecttext或textarea元素4 获得焦点事件onFocustext或textarea以及select5 失去焦点事件onBlurtext或textarea以及sele