案例2013年4月php第二个javascript

1、北京传智播客教育 JavaScript讲师：李东超北京传智播客教育 姓名：李东超手机： 邮箱： Q Q：274603699北京传智播客教育 Javascript简介JavaScript 是网景（Netscape）公司开发的一种基于客户端浏览器、面向（基于）对象、事件驱动式的网页脚本语言。北京传智播客教育 基本格式JavaScript区分大小写JavaScript脚本程序须嵌入在HTML文件中JavaScript脚本程序中不能包含HTML标记代码每行写一条脚本语句语句末尾可以加分号JavaScript脚本程序可以独立保存为一个外部文件北京传智播客教育 使用标签标签：属性：language：脚本语

2、言src：加载位置北京传智播客教育 例：document.write(“hello,javascript”);北京传智播客教育 变量变量是用来临时存储数值的容器，变量存储的数值是可以变化的变量必须要先声明才能使用，使用var声明变量变量的命名规则：第一个字符必须是英文字母，或者是下划线(_)；其后的字符，可以是英文字母，数字，下划线；变量名不能是JavaScript的保留字变量的作用域:全局变量、局部变量北京传智播客教育 数据类型StringNumberBooleanUndefinedNullobject北京传智播客教育 运算符算术运算符比较运算符逻辑运算符赋值运算符字符串运算符北京传智播客教

3、育 算术运算符+-*/%+ -北京传智播客教育 比较运算符=!=!=北京传智播客教育 逻辑运算符&|!北京传智播客教育 赋值运算符=+=-=*=/=%=北京传智播客教育 流程结构顺序结构分支结构循环结构北京传智播客教育 顺序结构document.write(“星期一”);document.write(“星期二”);document.write(“星期三”);北京传智播客教育 分支结构单项条件结构 (if条件语句)双项条件结构(if.else条件语句)多项条件结构(switch条件语句)北京传智播客教育 单项条件结构语法规则if (expression) statement1 北京传智播客教育

4、双项条件结构语法规则if (expression) statement1else statement2北京传智播客教育 多项条件结构语法规则switch (expression) case label1 : statement1; break; case label2 : statement2; break; default :statementdefault北京传智播客教育 循环结构for循环while循环dowhile循环forin循环北京传智播客教育 for循环语法规则：for(初始表达式;条件表达式;自增或自减)执行语句北京传智播客教育 while循环语法规则：while(条件表达式)

5、执行语句北京传智播客教育 do while循环语法规则： do执行语句while(条件表达式);北京传智播客教育 for in循环语法规则： for( 变量 in 数组或对象)执行语句北京传智播客教育 跳出循环continuebreak北京传智播客教育 函数系统函数自定义函数北京传智播客教育 函数使用函数前要先定义才能调用函数定义有三个部分:函数名,参数列表,函数体定义函数的格式function 函数名(参数1,参数2.)函数执行部分;return 表达式;北京传智播客教育 arguments属性arguments是函数的参数数组列表使用arguments属性在定义函数的时候无须指明函数的参数

6、列表，在函数调用时可以任意填充实现一个函数的多种功能北京传智播客教育 Script执行过程1、读入第一个代码段2、编译3、执行4、读入下一个代码段5、编译6、执行7、8、结束北京传智播客教育 数组一组数据的集合一维数组多维数组北京传智播客教育 创建数组var arr=值1,值2,值3;var arr=new Array(值1,值2,值3);var array=new Array(size);北京传智播客教育 数组长度length北京传智播客教育 遍历数组for( var i in array )北京传智播客教育 添加数组元素arrayObject.push(newelement1,newele

7、ment2,.,newelementX)arrayObject.unshift(newelement1,newelement2,.,newelementX) arrayObject.splice(index,howmany,element1,.,elementX) 北京传智播客教育 删除数组元素arrayObject.pop() arrayObject.shift() arrayObject.splice(index,howmany) 北京传智播客教育 数组的截取或合并arrayObject.slice(start,end) arrayObject.concat(arrayX,arrayX,.

8、,arrayX)返回新数组 北京传智播客教育 数组元素的排序arrayObject.sort() arrayObject.reverse() 北京传智播客教育 连接数组元素arrayObject.join(separator) 北京传智播客教育 切割字符串stringObject.split(separator, howmany) 北京传智播客教育 文本下标格式:arrkey北京传智播客教育 文本下标文本下标的数组元素不计入数组长度需要使用for.in语句进行遍历可以使用对象名.调用文本下标元素北京传智播客教育 Optionvar 对象=new Option(文本,值);对象名.options

9、options:选项对象集合对象名.options.add(选项对象) 添加选项北京传智播客教育 DOM编程北京传智播客教育 DOMDOM：document object model，是一种与浏览器、平台、语言无关的接口，使用该接口可以轻松地访问页面中所有的标准组件。北京传智播客教育 DOM操作DOM CoreHTML DOMCSS DOM北京传智播客教育 XML DOM北京传智播客教育 什么是XML DOMXML DOM 定义了访问和处理 XML 文档的标准方法。XML DOM 是用于获取、更改、添加或删除 XML 元素的标准 北京传智播客教育 节点整个文档是一个文档节点 每个 XML 标签

10、是一个元素节点 包含在 XML 元素中的文本是文本节点 每一个 XML 属性是一个属性节点 注释属于注释节点 北京传智播客教育 解析xml(一)xmlDoc=ActiveXObject(Microsoft.XMLDOM);xmlDoc.async=false;xmlDoc.load(books.xml); 北京传智播客教育 解析xml(二)xmlDoc=document.implementation.createDocument();xmlDoc.async=false;xmlDoc.load(books.xml); 北京传智播客教育 封装Public.js北京传智播客教育 获取节点nodeL

11、ist getElementsByTagName(name)nodeList：节点数组length:元素个数北京传智播客教育 dom 常用属性nodeNamenodeValueparentNodechildNodesattributes北京传智播客教育 dom 常用属性firstChildlastChild nextSibling previousSiblingdocumentElement 北京传智播客教育 创建节点createElement(tagName); createAttribute(name); createTextNode(text) 北京传智播客教育 添加节点appendCh

12、ild(newChild); setAttributeNode (newAttr)北京传智播客教育 删除节点removeChild(oldChild)北京传智播客教育 替换节点replaceChild(newChild,oldChild)； 北京传智播客教育 克隆节点cloneNode(true) 北京传智播客教育 删除属性removeAttribute(name) removeAttributeNode(node) 北京传智播客教育 事件指定事件处理程序直接在 HTML 标记中指定，是应用最普遍的方法北京传智播客教育 事件onLoadonUnloadonBluronFocusonClick北

13、京传智播客教育 事件onMouseOveronMouseOutonMouseDownonMouseUponMouseMove北京传智播客教育 事件onChangeonSelectonkeypressonkeydownonkeyup onSubmitonReset北京传智播客教育 浏览器对象模型(BOM)windownavigator浏览器信息location地址栏document文档screen屏幕北京传智播客教育 windowalert(message)confirm(message) prompt(message，defstr) open(url，name，features)打开新窗口cl

14、ose()关闭窗口blur()失去焦点focus()获得焦点print()打印北京传智播客教育 windowmoveBy(x，y)moveTo(x，y)resizeBy(x，y)resizeTo(x，y) scrollBy(x，y)scrollTo(x，y)setTimeout(表达式，毫秒)clearTimeout(定时器对象)北京传智播客教育 open方法的窗口规格参数menubar toolbarscrollbarsfullscreendirectorieslocationstatusresizablewidth、height、left、top北京传智播客教育 navigator对象appCodeNameappNameappVersionplatformonLinecookieEnabled北京传智播客教育 location对象hostporthrefpathnameprotocolsearchassign(url)北京传智播客教育 screen对象availHeight可用高度availWidt