3-3--javascript题材.ppt

javascript java培训 什么是JavaScript JavaScript 是一种脚本语言 提供用户交互 动态更改内容 数据验证 将JavaScript嵌入网页 可以将 JavaScript 语句插入 HTML 文档，方式 如下： 使用 SCRIPT 标签将语句嵌入文档 将 JavaScript 源文件链接到 HTML 文档中 javascript特点 弱类型语言，有对象特性 实现页面动态效果 客户端验证，减轻服务器压力 运算符 逻辑运算 ! || 循环 for循环 do-while while 语法基础小结 javascript是一个弱类型语言 基本语法和其他语言类似 js中的对象 js中的内置对象 常用对象包括 Date Math Array … 数组 声明数组 var 数组名 = new Array(数组大小); 例： var emp = new Array(3) 添加元素 emp[0] = “AA; emp[1] = “BB; emp[“cc”] = “CC; 数组 数组 常用属性 length ：返回数组中元素的个数 常用方法 Math 对象 String 对象 创建字符串有两种不同方法 ： 使用 var 语句 var newstr = “这是我的字符串 创建 String 对象 var newstr = new String (“这是我的字符串) String 对象 js中的函数与事件 通过事件和函数建立联系 事件分为 键盘 鼠标 系统 js中的函数 函数的含义：类似于Java中的方法，是完成特定任务的代码语句块 使用更简单：不用定义属于某个类，直接使用 js中的函数 系统函数 自定义函数 有参函数 无参函数 函数的调用 DOM 是w3c指定的html标准的一部分 HTML文档的树状结构 DOM对象模型-2 Window对象常用的属性 思考 如何获得当前时间并动态显示？ 定时函数 setTimeout()用法 setTimeout（“调用的函数”, “指定的时间后） setInterval()方法 setInterval（“调用的函数”, “指定的时间间隔） 重复调用 history 和location对象-1 history 对象 history 和location对象-2 Location 对象 属性 方法 元素的内部内容 绝大部分html元素都支持innerHTML属性来获得或者设置内部的元素 innerText是设置内部文本，部分浏览器不支持 Dom编程 javascript对样式的控制 js如何控制样式？ HTML元素.style.样式属性＝值 采用className改变属性格式 采用style控制如果属性很多，比较繁琐 可以定义成class样式，一次替换 元素.className=“?” 思考 如何实现 实现让图片 点击一次变大 10个像素的功能？ BOM和DOM小结 可以操作html元素，包括获得内容、控制样式等 JavaScript 事件 javascript事件 大部分的html元素都有不同的事件处理特定的操作 不仅仅是表单元素 获得表单元素 特别说明：对于表单元素除了用前面的方法外，还可以用如下的方式 通过form的路径方式 比如document.forms[0]获得html的第一个表单 表单.elementName获得元素 Document.forms[0].usename 表单验证 表单验证的思路 常用验证提示 制作回车切换输入的效果 错误停留焦点，正确切换到下一个元素 制作即时提示错误的输入框 下拉框功能 小结下拉框控件SELECT： 常用属性 length value options selectedIndex 常用事件 onChange onBlur onFocus 下拉框（select）的动态填充 document.createElement(“option”) new Option(“text”,”value”) 命令按钮对象 “按钮 - 事件处理程序 总结 javascript是操作html元素的重要手段 涵盖样式、事件等 获取样式属性值 获取行内样式的方法 var divObj=document.getElementById(test); var objTop=divObj.style.top; document.getElementById(elementId).样式属性值 获取类样式的方法 currentStyle getComputedStyle() var divObj=document.getElementById(test); var objTo