第二章javascript内置对象

第二章JavaScript内置对象回顾JavaScript

介绍JavaScript

基本语法JavaScript

数据类型数据类型分类数字类型字符串类型类型转换JavaScript

运算符JavaScript

变量与函数JavaScript

控制语句本章内容JavaScript

对象事件处理JavaScript

对象JavaScript

String对象JavaScript

Array对象JavaScript

Date对象JavaScript

RegExp正则表达式对象对象事件处理JavaScript是一种基于对象和事件驱动的解释性脚本语言对象事件概念指DHTML对象在状态改变、操作鼠标或键盘时触发的动作对象事件的分类鼠标事件：针对鼠标单击、双击、移动等动作键盘事件：针对按下键盘产生的动作状态改变事件：在载入文档、退出、获取焦点、失去焦点、提交、变化等动作时产生的事件对象事件处理常见事件分类图对象事件onclick单击

ondblclick双击onmousedown鼠标按下

onmouseup鼠标弹起

onmouseover鼠标移入

onmouseout鼠标移出onkeypress按过键盘

onkeydown键盘按下

onkeyup键盘弹起onload

文档装载完毕

onunload

退出文档

onchange

值发生变化

onfocus

获得焦点

onblur

失去焦点

onresize调整窗口大小

onsubmit表单提交鼠标事件键盘事件状态事件对象事件处理event事件对象事件触发后将会产生一个event对象event对象记录事件发生时的鼠标位置、键盘按键状态和触发对象等信息对象事件处理主要的属性clientX、clientY事件触发时鼠标光标相对浏览器窗口的坐标screenX、screenY事件触发时相对客户端屏幕的位置坐标offsetX、offsetY事件触发时相对引发事件标记对象的位置x、y事件触发时鼠标光标相对父组件的位置坐标对象事件处理主要的属性srcElement

触发该事件的标记对象button

鼠标按下的键（1左键、2右键、4中键）keyCode

键盘按键的Unicode码altKey/ctrlKey/shiftKey

键盘的alt、ctrl、shift键是否按下（以下专门针对onmouseover和onmouseout事件）fromElement

鼠标原来所处标记对象toElement

鼠标现在所处标记对象对象事件处理属性定义中直接处理事件<!--在属性定义中直接处理对象事件--><bodyonload=“alert(‘load

事件…')"onunload="alert(‘unload

事件…')"><input

type="button"value="单击"onclick="alert(‘click事件…')"></body>定义进入、退出文档和单击按钮事件对象事件处理IE的冒泡事件处理机制DocumentFormInputSelectTextareaonclick="alert('click

input')"onclick="alert('click

form')"onclick="alert('click

doc')"当处于DHTML对象模型底部对象事件发生时会依次激活上面对象定义的同类事件处理。可以使用event.cancelBubble=true阻止冒泡。事件定义方式将事件处理程序直接嵌入HTML标记符中直接写在对象后面<input

type=

"button"value="打开google网站"onclick="window.open('')“>在定义事件时候，指向JavaScript中对应的方法,也可以传入参数<input

type=

"button"value="打开google网站"onclick=“test()">JS代码:function

test(){window.open('

');}document.onLoad=alert('这是事件处理程序');应用举例1例1：<Body><FONT

STYLE="cursor:hand"onClick=“location=‘

'"onMouseOver=“status=‘案例1';this.color='red';return

true"onMouseOut="status='';this.color='blue'">Oracle学习</FONT></Body>应用举例2<Body><FORM

name=fff>请输入基本资料：<BR>姓名：<INPUT

TYPE="text"

NAME="usr"SIZE="8"><INPUT

TYPE="button"VALUE="请单击"onClick="alert(fff.usr.value+':谢谢你!')"></Body>对象对象的概念与分类：对象由属性和方法封装而成JavaScript是一种基于对象语言，对象是JavaScript中最重要的元素JavaScript包含四种对象内置对象自定义对象浏览器对象ActiveX对象对象11种内置对象包括Array

,String

,

Date,

Math,

Boolean,

NumberFunction,

Global,

Error,

RegExp

,

Object简介在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象也可以用创建对象的方法定义变量String、Math、Array、Date、RegExp是JavaScript中常用的重要内置对象内置对象的分类类型内置对象介绍数据对象Number数字对象String字符串对象Boolean布尔值对象组合对象Array数组对象Math数学对象Date日期对象高级对象Object自定义对象Error错误对象Function函数对象RegExp正则表达式对象Global全局对象创建String对象自动创建字符串对象手工创建字符串对象var

str1="hello

world";alert(str1.length);alert(str1.substr(1,5));var

str1=

new

String("hello

word");alert(str1.length);alert(str1.substr(1,3));调用字符串的对象属性或方法时自动创建对象，用完就丢弃采用new创建字符串对象str1，全局有效获取字符串长度书写格式x.length使用注解x代表字符串对象length必须小写中间用点操作符调用汉字、字母长度均为1返回大于或等于0整数var

str1="String对象";varstr2="";alert("str1长度"+str1.length);alert("str2长度"+str2.length);String对象的方法String对象的方法分类String对象方法格式编排方法大小写转换获取指定字符查询字符串子字符串处理截取替换分割连接String对象的方法(1)类别方法说明大小写转换toLowerCase()返回小写字符串toUpperCase()返回大写字符串获取指定字符charAt(index)返回指定位置字符charCodeAt(index)返回指定位置字符Unicode编码查询字符串indexOf(findstr,index)返回正向的索引位置lastIndexOf(findstr)返回反向的索引位置match(regexp)返回匹配的字符串search(regexp)返回找到字符串的首字符索引String对象的方法(1)--查询字符串书写格式x.match(regexp)x.search(regexp)使用注解x代表字符串对象regexp代表正则表达式或字符串match返回匹配字符串的数组，如果没有匹配则返回nullsearch返回匹配字符串的首字符位置索引var

str1="JavaScript网页教程";varstr2=str1.match("Script");varstr3=str1.search("Script");alert(str2[0]);//结果为"Script"alert(str3);//结果为4String对象的方法(2)类别方法说明获取子字符串substr(start,length)返回从索引位置start开始长为length的子字符串substring(start,end)返回start开始end结束的子字符串slice(start,end)同substring，但允许使用负数表示从后计算位置替换子字符串replace(findstr,tostr)返回替换finstr为tostr之后的字符串分割字符串split(bystr)返回由bystr分割成的字符串数组连接字符串concat(string)返回与string连接后的字符串String对象的方法(2)使用范例var

str1="Oracle甲骨文Oracle";varstr2="str1.substr(3,3):"+str1.substr(3,3);var

str3

=

"str1.substring(3,8):"+str1.substring(3,8);var

str4

=

"str1.slice(3,8):"+str1.slice(3,8);var

str5="str1.replace(\"cl\",\"1234\"):"+str1.replace("cl","1234");var

str6=“str1.split(‘a’):”+str1.split(‘a’); //返回数组var

str7="str1.concat('字符串方法测试'):"+str1.concat('字符串方法测试');document.write("str1="+str1+"<br/>");document.write(str2+"<br/>");document.write(str3+"<br/>");document.write(str4+"<br/>");document.write(str5+"<br/>");document.write(str6+“<br/>”);

//直接输出数组的所有内容

document.write(str7+"<br/>");创建Array对象创建数组对象var

cnweek=new

Array(7);var

books=new

Array();初始化数组对象创建数组时允许指定元素个数也可以不指定元素个数也可以直接在建立对象时初始化数组元素，元素类型允许不同var

cnweek=new

Array(7);cnweek[0]="星期日";cnweek[1]="星期一";...cnweek[6]="星期六";var

test=new

Array(100,"a",true);创建Array对象创建二维数组var

cnweek=new

Array(7);for

(var

i=0;i<=6;i++){cnweek[i]=new

Array(2);}cnweek[0][0]="星期日";cnweek[0][1]="Sunday";cnweek[1][0]="星期一";cnweek[1][1]="Monday";...cnweek[6][0]="星期六";cnweek[6][1]="Saturday";通过指定数组中的元素为数组的方式可以创建二维甚至多维数组星期日Sunday星期一Monday星期二Tuesday星期三Wensday星期四Thursday星期五Friday星期六Saturday获取数组元素的个数书写格式x.length使用注解x代表数组对象length必须小写中间用点操作符调用返回大于或等于0整数var

cnweek=new

Array(7);cnweek[0]="星期日";cnweek[1]="星期一";cnweek[2]="星期二";cnweek[3]="星期三";cnweek[4]="星期四";cnweek[5]="星期五";cnweek[6]="星期六";for

(var

i=0;i<cnweek.length;i++){document.write(cnweek[i]+"

|

");}Array对象的方法(1)类别方法说明连接数组join(bystr)返回由bystr连接数组元素组成的字符串toString()返回由逗号(,)连接数组元素组成的字符串concat(value,...)返回添加参数中元素后的数组数组排序reverse()返回反向的数组sort()返回排序后的数组Array对象的方法(1)使用范例var

arr1=[32,

12,

111,

444];document.write("arr1倒置前："+arr1.toString()+"<br/>");arr1.reverse();document.write("arr1倒置后："+arr1.toString()+"<br/><br/><br/><br/>");document.write("arr1默认排序前："+arr1.toString()+"<br/>");arr1.sort();

//默认按字母顺序排序document.write("arr1默认排序后："+arr1.toString()+"<br/><br/><br/><br/>");functionnumorder(a,b){return

a-b;}document.write("arr1指定排序前："+arr1.toString()+"<br/>");arr1.sort(numorder); //指定排序规则document.write("arr1指定排序后："+arr1.toString());Array对象的方法(2)类别方法说明获取子数组slice(start,end)通过数组元素起始和结束索引号获取子数组splice(start,deleteCount,

value,...)对数组指定位置进行删除和插入进出栈操作push(value,

...)数组末端入栈操作pop()数组末端出栈操作unshift(value,...)数组首端入栈操作shift()数组首端出栈操作Array对象的方法(2)使用范例var

array1

=[1,2,3,4];document.write("array1数组："+array1.toString()+"<br/>");array1.push(60,70);

//push方法会对数组产生影响document.write("array1.push(60,70)方法："+array1.toString()+"<br/><br/><br/>");var

array2

=[1,2,3,4];document.write("array2数组："+array2.toString()+"<br/>");array2.push([40,100]);document.write("array2.push([40,100])方法："+array2.toString()+"<br/><br/><br/>");var

array3

=[1,2,3,4,5,6,7];document.write("array3数组："+array3.toString()+"<br/>");array3.pop();document.write("array3.pop()方法："+array3.toString()+"<br/><br/><br/>");创建Date对象创建日期对象//方法1：不指定参数

var

nowd1=new

Date();alert(nowd1.toLocaleString(

));//方法2：参数为日期字符串var

nowd2=new

Date("2004/3/20

11:12");alert(nowd2.toLocaleString(

));var

nowd3=new

Date("04/03/20

11:12");alert(nowd3.toLocaleString(

));创建Date对象创建日期对象//方法3：参数为毫秒数

var

nowd3=new

Date(5000);alert(nowd3.toLocaleString(

));alert(nowd3.toUTCString());//方法4：参数为年月日小时分钟秒毫秒

var

nowd4=new

Date(2004,2,20,11,12,0,300);alert(nowd4.toLocaleString());//毫秒并不直接显示月份参数从0~11，所以这里2对应3月份Date对象的方法获取日期和时间getDate()

获取日getDay()

获取星期getMonth()

获取月getFullYear()

获取完整年份getYear()

获取年getHours()

获取小时getMinutes()

获取分钟getSeconds()

获取秒getMilliseconds()

获取毫秒getTime()

返回累计毫秒数(从1970/1/1午夜)Date对象的方法程序示范functionwriteln(mystr){document.write(mystr+"<br>");}var

x=new

Date(1997,7,1,12,23,54,230)//1997年8月1日12点23分54秒230毫秒writeln(x.getFullYear

());writeln(x.getYear());writeln(x.getMonth());writeln(x.getDate());writeln(x.getDay());writeln(x.getHours());writeln(x.getMinutes());writeln(x.getSeconds());//返回年1997//返回年97//返回月7//返回日1//返回星期5//返回小时12//返回分钟23//返回秒54writeln(x.getMilliseconds()); //返回毫秒230writeln(x.getTime());//返回累计870409434230Date对象的方法设置日设置月设置年设置小时设置分钟设置秒设置毫秒(0-999)设置日期和时间setDate(day_of_month)setMonth

(month)setFullYear

(year)setHours

(hour)setMinutes

(minute)setSeconds

(second)setMillliseconds

(ms)setTime

(allms)

设置累计毫秒(从1970/1/1午夜)Date对象的方法程序示范var

x=new

Date();x.setFullYear

(1997);x.setMonth(7);x.setDate(1);x.setHours(5);//设置年1997//设置月7//设置日1//设置小时5x.setMinutes(12); //设置分钟12x.setSeconds(54);//设置秒54x.setMilliseconds(230);//设置毫秒230document.write(x.toLocaleString()+"<br>");//返回1997年8月1日5点12分54秒x.setTime(870409430000);//设置累计毫秒数

document.write(x.toLocaleString()+"<br>");//返回1997年8月1日12点23分50秒Date对象的方法日期和时间的转换getTimezoneOffset()返回本地时间与GMT的时间差，以分钟为单位toUTCString()返回国际标准时间字符串toLocalString()返回本地格式时间字符串Date.parse(x)返回累计毫秒数(从1970/1/1午夜到本地时间)Date.UTC(x)返回累计毫秒数(从1970/1/1午夜到国际时间)Date对象的方法程序示范functionwriteln(mystr){document.write(mystr+"<br>");}var

x=new

Date();writeln("x.getTimezonOffset()=");writeln(x.getTimezoneOffset());//时间差

writeln("x.toUTCString()=");writeln(x.toUTCString());//国际时间

writeln("x.toLocaleString()=");writeln(x.toLocaleString());//本地时间

writeln("Date.parse(x)=");writeln(Date.parse(x));//本地时间毫秒数

writeln("Date.UTC(x)=");writeln(Date.UTC(x));//UTC毫秒数RegExp正则表达：声明正则表达式的方式：正则表达式直接量也被定义为包含在一对斜杠(/)之间的字符.所以,JavaScript可能会包含如下的代码:var

pattern

=

/s$/;这行代码创建一个新的RegExp对象,并将它赋给变量parttern.这个特殊的RegExp对象和所有以字母"s"结尾的字符串都匹配.用RegExp()也可以定义一个等价的正则表达式,代码如下:var

pattern

=

new

RegExp("s$");new

RegExp(pattern,

attributes);正则表达式的语法：关于更多语法，可参考JavaScript手册字符说明\将下一字符标记为特殊字符、文本、反向引用或八进制转义符。例如，“n”匹配字符“n”。“\n”匹配换行符。序列“\\”匹配“\”，“\(”匹配“(”。^匹配输入字符串开始的位置。如果设置了RegExp

对象的Multiline

属性，^还会与“\n”或“\r”之后的位置匹配。$匹配输入字符串结尾的位置。如果设置了RegExp

对象的Multiline

属性，$还会与“\n”或“\r”之前的位置匹配。*零次或多次匹配前面的字符或子表达式。例如，zo*

匹配“z”和“zoo”。*

等效于{0,}。+一次或多次匹配前面的字符或子表达式。例如，“zo+”与“zo”和“zoo”匹配，但与“z”不匹配。+等效于{1,}。?零次或一次匹配前面的字符或子表达式。例如，“do(es)?”匹配“do”或“does”中的“do”。?等效于{0,1}常用的正则表达式："^\\d+$" //非负整数（正整数+0）"^[0-9]*[1-9][0-9]*$"//正整数//非正整数（负整数+0）"^((-\\d+)|(0+))$""^-[0-9]*[1-9][0-9]*$"//负整数"^-?\\d+$" //整数"^\\d+(\\.\\d+)?$" //非负浮点数（正浮点数+0）"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$" //正浮点数"^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$" //非正浮点数（负浮点数+0）"^[A-Za-z]+$""^[A-Z]+$"//