第一章网页编程基础ppt课件

第一章网页编程基础,1.3中常用标记,1.2中常用标记,1.1HTML基础,1.4JavaScript编程入门,1.5窗口中的对象和元素,1.0任务引入,能力目标,C#,SQLServer,XML,PSPM,ASP.NET,Oracle,OOAD,ComputerBase,HTML/JavaScript,SQLBase,OOP/Java,C,STB,JSP/Servlet,EJB/WebService,WinForms,Struts/JSF,Testing/SQA,Linux,能力目标,了解B/S结构的工作原理，企业的开发模式及开发细节掌握多层架构技术，熟练应用MVC模式熟练应用表示层技术（HTML及有效的使用JavaScript验证）熟练应用数据层技术（JDBC数据访问技术）熟练应用业务逻辑层技术（Servlet和JSP）,能力目标,熟练应用控制层技术（JavaBean数据装载、Filter字符过滤)通过项目练习，独立开发企业级应用的B/S系统,能力目标,HTML部分熟练掌握HTML的基本结构熟练应用HTML标记编写Web页面JavaScript部分掌握JavaScript的语法会使用JavaScript的内置对象与对话框熟练应用JavaScript事件机制并进行表单验证,态度目标,学习态度；主动性；理解能力。,本章知识点,HTML基本结构标记：INPUT、RADIO、SELECT、TEXTAREA、CHECKBOX、BUTTON、SUBMIT、RESET、HIDDENJavaScript基础：将JavaScript嵌入到HTML页面、注释、变量定义、流程控制、循环、函数定义,本章知识点,JavaScript内置对象：window、document、formJavaScript对话框alert、confirm、prompt事件处理：onLoad、onFocus、onBlur、onclick、onChange、onSelect、onSubmit表单验证,任务引入,美国Loucs公司希望开发一套客户投保系统，由客户自行在系统中选择投保内容，为方便各地客户操作，系统应采用网络方式进行，并且为了给客户留下良好的印象，要求界面干净整洁，并且对于客户的操作有良好的验证性，以解决公司员工的工作量。本章节的HTML界面设计及JavaScript验证内容可以很好的解决上述问题。,1.1HTML基础,HTTP-HyperTextTransferProtocol：超文本传输协议HTML-HyperTextMarkupLanguage：超文本标记语言FTP-FileTransferProtocol：文件传输协议URL-UniformResourceLocators：统一资源定位器,1.1HTML基础,HTML基本框架Sample,1.1HTML基础,标记文档中含有超文本的内容html文档的头部，含有初始化信息页面的标题文档体，包含页面所有的具体内容,1.1HTML基础,超级链接图片标记,1.2中常用标记,：用于设置一些头信息。用于定义格式。用于定义脚本。,1.3中常用标记,：各级标题：字体的颜色、大小：黑体：斜体：下划线：斜向上表示：斜向下表示：无序号列表：有序号列表,1.3中常用标记,：定义段落：换行：分区显示：定义表格：定义行：定义列：定义表头,1.3中常用标记,定义表单文本框密码框多选框单选框隐藏项文本域,1.4JavaScript编程入门,1.4.2JavaScript基本语法,1.4.1JavaScript简介,1.4.3JavaScript函数,1.4.4JavaScript事件处理,1.4.5JavaScript的对话框,1.4.1JavaScript简介,JavaScript是一种描述式语言，它与HTML结合起来，用于增强功能，并提高与最终用户之间的交互性能。由Netscape公司利用Sun的Java开发。它是与Java完全不同的一种语言。虽然在结构和语法上与Java类似，但是，它只是函数式的语言。客户端的JavaScript必须要有浏览器的支持。,1.4.1JavaScript简介,在网页中加入JavaScript通过在网页中加入标记JavaScript的开始和结束，将JavaScript代码放到之间。也可以引入一个外部的JavaScript文件，这个JavaScript文件一般以.js作为扩展名原则上，放在之间。但视情况可以放在网页的任何部分。一个页面可以有几个，不同部分的方法和变量，可以共享。,1.4.2JavaScript基本语法,JavaScript是一门弱类型的语言，所有的变量定义均以var来实现。JavaScript的变量必需先定义，再使用。JavaScript区分大小写。,1.4.2JavaScript基本语法,1.JavaScript基本语法变量变量定义：用var来定义变量。虽然JavaScript可以不需定义即可直接使用变量，但不建议这么做（例12.htm）。2.JavaScript基本语法数组数组定义：vararr=newArray(3);通过arr.length取得数组的长度。例13.htm,1.4.2JavaScript基本语法,3.JavaScript基本语法运算符算术运算+、-、*、/（例14.htm）、=、=、=。逻辑运算与：&或：|非：!例15.htm,1.4.2JavaScript基本语法,字符串运算符连接运算：+（例16.htm）取子集：substring(index1,index2)（例17.htm）条件表达式条件?A:B(例18.htm),1.4.2JavaScript基本语法,4.JavaScript基本语法控制语句if语句if(条件)elseif(条件1)else(例19.htm)while语句while(条件)例20.htmswitch语句switch(i)casei1:casei2:default:(例21.htm),1.4.2JavaScript基本语法,for例22.htmdowhile例23.htmwhile例24.htm,1.4.3JavaScript函数,函数的定义例：利用function来定义一个函数（例25.htm）例：传入参数（例26.htm）例：传出值（例27.htm）,1.4.4JavaScript事件处理,onBlur：在select、text、password、textarea失去焦点时。onChange：在select、text、textarea的值被改变且失去焦点时。onClick：出现在一个课选对象被鼠标选中时（button,checkbox,radio,link,reset,submit,text,textarea等）。onFocus：在用户为了输入而选择select、text、textarea时onLoad：出现在一个文档完成对一个窗口的载入时。,1.4.4JavaScript事件处理,onMouseOver：鼠标被移动到一个超连接上时。onMouseOut：鼠标从一个超连接上移开时。onSelect：当form对象中的内容被选中时。onSubmit：出现在用户通过提交按钮提交一个表格时。onUnload：当用户退出一个文档时。,1.4.5JavaScript的对话框,警告框(alert)：出现一个提示信息。例28.htm询问框(prompt)：返回输入的值。例29.htm确认框(confirm)：根据不同的选择，返回true/false。例30.htm,1.5窗口中的对象和元素,window当前窗口新开窗口（例b1.htm）通过本地窗口控制新开窗口（例b2.htm）location获取或设置现有文档的URL（例b3.htm/例b4.htm/例b5.htm）,1.5窗口中的对象和元素,history先前访问过的URL的历史列表（例b5.htm/例b6.htm）常用方法：back()，go(number)document当前的文档对象document.write()document.formName(),HTML基本结构标记：INPUT、RADIO、SELECT、TEXTAREA、CHECKBOX、BUTTON、SUBMIT、RESET、HIDDEN将JavaScript嵌入到HTML页面、注释、变量定义、流程控制、循环、函数定义JavaScript内置对象及DOM结构JavaScript对话框alert、