5JavaScript.ppt

Web标准网页设计与PHP 唐四薪 主编 第5章 JavaScript JavaScript的特点 JavaScript的作用 1. 校验用户输入的表单内容； 2. 动态添加网页内容； 3. 为静态网页增加一些特效（如动画效果） 4. 操纵DOM元素（改变元素的属性和内容） 网页中插入JavaScript脚本的方法 使用script标记将脚本嵌入到网页中（嵌入式） 直接将脚本嵌入到HTML标记的事件中（行内式） 通过script标记的src属性链接外部脚本文件（链接式） 第一个JavaScript程序 html head title第一个JavaScript程序/title script type=text/JavaScript !-- type属性也可省略 -- function msg () //JavaScript注释：建立函数 {alert (Hello, the WEB world!)} /script /head body p onClick=msg()Click Here/p !--HTML注释,调用函数 -- /body /html 开发和调试JavaScript的工具 Firefox：【工具】→【错误控制台】 IE：【工具】 → 【 Internet选项】 → 【高级】 → 【显示每个脚本错误的通知】勾选中 代码提示：Dreamweaver CS4， Aptana JavaScript语言基础 JavaScript变量 弱类型变量，用“var”关键字，并可以将其初始化为任何值 var name =Six Hang; var age＝28; var school=CSU; var male=true; 变量命名规范：第一个单词所有字母都小写，以后每个单词第一个字母大写，例如：sMyString 变量的命名原则 首字符必须是字母、下划线（_）或美元符（$） 余下的字母可以是下划线。美元符号、任意字母或者数字； 变量名不能是关键字或保留字 变量名对大小写敏感 变量名中不能有空格、回车符或其他标点字符 var 5zhao; //数字开头，非法 var tang-s, tang’s; var this; //不能使用关键字作变量名 运算符 运算符是指完成操作的一系列符号，也称为操作符 1. 算术运算符 +、-、*、/、%、++、- - 2. 比较运算符 、、=、= 、==、===、!=、!== 3. 逻辑运算符 、 || 、! 4. 赋值运算符 =+、=、-= 运算符（续） 5. 连接运算符 + 6. 其他运算符 ?: 、typeof、[]、() 、new 表达式 表达式是运算符和操作数的组合 3.2.3 JavaScript数据类型 字符串（String） var course=data structure“ （1）length属性： （2）charAt方法 （4）indexOf：用于查找和定位子串 （6）substr方法 （8）split方法：根据指定的符号将字符串分割成一个数组。 数值型（number） 在Javascript中，数值型数据不区分整型和浮点型，数值型数据和字符型数据的区别是数值型数据不要用引号括起来。例如下面都是正确的数值表示法， var num1=23.45 var num2=76 var num3=-9e5 //科学计数法，即-900000 alert(num1+ + num2+ + num3); 布尔型（boolean） 布尔型数据的取值只有两个：true和false。布尔型数据不能用引号引起来，否则就变成字符串了。用方法typeof()可以返回一个字符串，字符串的内容就是变量的数据类型名。 var married = true; document.write(typeof(married) +br /);// 输出boolean married = true; document.write(typeof(married)); // 输出？ 3.2.4 数组（array） 1. 数组的定义（三种方法） var rank =new Array(12); //第1种定义方法 var Map =new Array(“China”, “USA”, “Britain”); //第2种定义方法 var Map =[China, USA, Britain]; //第3种定义方法 2. 数组的常用属性和方法 （1）length属性：用来获取数组的长度 （2）toString方法：将数组转化为字符串 （4）join方法：将数组的内容连接起来，返回字符串 （9）slice方法：返回数