PHP程序设计案例教程课件作者陈建国第3讲第3讲JavaScript程序基础知识.ppt

1. 表单验证验证 会员注册页面 获得焦点时（光标移入） 失去焦点时（光标移出） 失去焦点时（光标移出） 3 JavaScript交互方式 1. 表单验证验证 知识点： 几种样式？ 动态设置标签内容？ 获取焦点事件？ 失去焦点事件？ 3 JavaScript交互方式 1. 表单验证验证 */63 知识点： 几种样式？ 动态设置标签内容？ 获取焦点事件？ 失去焦点事件？ html head script type=text/javascript function foucs_mail() { document.getElementById(span_mail).className=span2; document.getElementById(span_mail).innerHTML=img src=images/reg2.gif style=vertical-align: middle /8-50个字符; }/script /head body form name=form1 action= method=post input type=text name=txt_mail class=text onfocus=foucs_mail() onblur=blur_mail() / div id=span_mail class=span1 img src=images/reg1.gif style=vertical-align: middle /请输入邮箱 /div /form /body /html 修改内容 修改属性 定位链接元素（对象） 获取焦点 失去焦点 3 JavaScript交互方式 1. 表单验证验证 实现步骤： 1）设置样式 2）编写Javascript代码 3）设置获取焦点事件 4）设置失去焦点事件 3 JavaScript交互方式 《PHP程序设计》 --教师姓名 */31 《PHP程序设计》 --教师姓名 */31 尚辅网 / 第3讲 JavaScript程序基础知识 教师姓名 教研室名称 2012年01月01日 机械工业出版社 内容要点 CONTENTS  1. JavaScript介绍 2. JavaScript基本语法 3. JavaScript交互方式 本章任务 制作淘宝网购物 简易计算器页面 1）什么是JavaScript JavaScript是一种脚本编程语言，是基于对象且事件驱动的程序，只是其程序代码嵌在HTML网页文件中，需要浏览者的浏览器进行解释运行。 HTML、XHTML是一种标记语言，用某种结构存储数据并且在设备上显示的手段。 1 JavaScript介绍 2）JavaScript有什么功能 （1）控制文档的外观和内容：动态改变CSS样式及页面内容 （2）控制浏览器的行为：浏览器的退后、刷新、状态栏信息 （3）用户交互操作：网上调查问卷、网上算命页面 （4）与页面各种元素交互：动态改变图片、元素属性等 （5） 读写部分客户端信息：读写客户端浏览器版本等 1 JavaScript介绍 3）在什么地方编写JavaScript JavaScript包含于script/script标签之中 写在head/head中（推荐） 写在body/body中，可多处 1 JavaScript介绍 4） 一个简单的JavaScript程序 HTML HEAD TITLE脚本的基本结构/TITLE SCRIPT language=javascript var count=0; document.write(淘宝网欢迎您！); for(i=0;i5;i++) document.write(H2淘宝网欢迎您！/H2); /SCRIPT /HEAD BODY H1 BODY部分的内容/H1 /BODY /HTML 如何使用JavaScript实现此部分内容？ 1 JavaScript介绍 脚本的执行原理 应用 服务器 IE IE 解析HTML标签和JavaScript脚本 从服务器端下载含JavaScript的页面 返回响应 客户端请求含JS的页面 发送请求 1 用户输入 2 3 1 JavaScript介绍 HTML HEAD TITLE脚本的基本结构/TITLE SCRIPT language=javascript var count=0; document.write(淘宝网欢迎您！); for(i=0;i5;i++) document.write(H2淘宝网欢迎您！/H2); /SCRIPT