网页制作-JS基本语法(自学)

主讲：谢翠萍信息工程教研室,网页制作,一个简单的javascript程序,一个简单的Javascript程序,JavaScrip特点,jQuery是一个兼容多浏览器的JavaScript框架。它是JS的一个类库，很多的特效被封装了。常用的jquery特效：焦点图、选项卡、滚动条、下拉广告、图片延时加载等、放大镜特效、广告代码，导航，在线客服，相册代码,京东网上商城应用的jQuery效果应用了jQuery实现了标签页的效果，将鼠标移动到“手机充值”栏目上时，标签页中将显示为手机充值的相关内容，如图所示，将鼠标移动到“游戏充值”栏目上时，将显示为游戏充值的相关内容。,JavaScript的应用,应用Ajax技术实现百度搜索提示在百度首页的搜索文本框中输入要搜索的关键字时，下方会自动给出相关提示。如果给出的提示有符合要求的内容，可以直接选择，这样可以方便用户。,JavaScript的应用,行为是Dreamweaver内置的JavaScript程序库，由事件（Event）和动作（Action）组成。行为是指某个事件发生时浏览器执行的动作，能实现用户与网页间的交互，通过某个动作来触发某项计划。,行为,事件是浏览器生成的消息，它指示该页的访问者已执行了某种操作。不同的页面元素定义了不同的事件，在大多数浏览器中，onMouseOver事件和onClick事件是与链接关联的事件，而onLoad事件是与图像和文档的body部分关联的事件。,行为,动作是一段预先编写好的JavaScript代码，可用于执行以下常见的任务：打开浏览器窗口、显示或隐藏AP元素、弹出信息、设置导航栏图像、播放声音或影片等。,行为,对象事件处理,对象事件概念指DHTML对象在状态改变、操作鼠标或键盘时触发的动作对象事件的分类鼠标事件：针对鼠标单击、双击、移动等动作键盘事件：针对按下键盘产生的动作状态改变事件：在载入文档、退出、获取焦点、失去焦点、提交、变化等动作时产生的事件浏览器事件:浏览器事件主要由Load、unLoad、DragDrop以及Submit等事件组成。,常见事件分类图,对象事件,onclick单击ondblclick双击onmousedown鼠标按下onmouseup鼠标弹起onmouseover鼠标移入onmouseout鼠标移出,Onkeypress按过键盘onkeydown键盘按下onkeyup键盘弹起,onload文档装载完毕onunload退出文档onchange值发生变化onfocus获得焦点onblur失去焦点onresize调整窗口大小onsubmit表单提交,对象事件处理,1、执行顺序,2、大小写敏感,3、每行结尾的分号可有可无,JavaScript的基本语法,执行顺序,JavaScript程序按照在HTML文件中出现的顺序逐行执行。如果需要在整个HTML文件中执行（如函数、全局变量等），最好将其放在HTML文件的标记中。某些代码，比如函数体内的代码，不会被立即执行，只有当所在的函数被其他程序调用时，该代码才会被执行。,JavaScript的基本语法,大小写敏感,严格区分字母大小写；变量username与变量userName是两个不同的变量。,JavaScript的基本语法,每行结尾的分号可有可无,如果语句的结束处没有分号，JavaScript会自动将该行代码的结尾作为语句的结尾。例如，下面的两行代码都是正确的。alert(您好！欢迎访问我公司网站！)alert(您好！欢迎访问我公司网站！);,JavaScript的基本语法,对象,对象由属性和方法封装而成JavaScript是一种基于对象语言，对象是JavaScript中最重要的元素由属性和方法两个基本的元素构成。,对象,在JavaScript程序大多数功能都是通过对象实现的,varaa=Number.MAX_VALUE;/利用数字对象获取可表示最大数varbb=newString(helloJavaScript);/创建字符串对象varcc=newDate();/创建日期对象vardd=newArray(星期一,星期二,星期三,星期四);/数组对象,（1）使用点（.）运算符university.Name=“清华大学”;university.City=“北京市”;university.Date=2004;（2）通过对象的数组下标实现引用university0=“清华大学”;university1=“北京市”;university2=2004;,对象属性的引用,（3）除了用数字作为下标外，也可以用字符串作下标。university“Name”=“清华大学”;university“City”=“北京市”;universityDate=2004;,对象属性的引用,对象.方法名称()对象的方法实际上就是一个函数。例如，我们在前面用到了document的write方法：document.write(“”);,对象的方法的引用,（1）for.in语句for（对象属性名in已知对象名）用于对已知对象的所有属性进行操作的控制循环。它是将一个已知对象的所有属性反复置给一个变量；而不是使用计数器来实现的。该语句的优点就是无需知道对象中属性的个数即可进行操作。,有关对象操作语句,例如下面的语句显示university对象中各个属性：for(variinuniversity)document.write(universityi)；,有关对象操作语句,（2）with语句程序中需要使用某个对象的许多属性和方法，则可以考虑使with用语句。with(对象名称).with(university)Name=“清华大学”;City=“北京市”;Date=2004;,对象,（3）this关键字（4）new运算符对象名称=new对象所属的类（参数）;newDate=newDate();/没有参数，则建立的日期对象中存放的是当前日期和时间birthday=newDate(2004,2,28);/有参数，则建立的日期对象中存放的是指定的日期和时间,对象,1、常用内部对象有两种情况：其一是说该对象是静态对象，即在引用该对象的属性或方法时不需要为它创建实例；而另一种对象则在引用它的对象或方法是必须为它创建一个实例，即该对象是动态对象。,常用对象的属性和方法,串（String）对象内部静态性对象。访问属性和方法时，可使用（.）运算符实现。创建一个String对象非常简单，由于它是一个静态对象，不需要专门使用new运算符，对变量赋值为字符串即可。例如：varstr=“Hello”;,常用对象的属性和方法,算术函数的math对象math对象：提供了所需要的各种数学运算。静态对象(不需要创建具体的实例即可使用)。a=Math.abs(-5.04);,常用对象的属性和方法,日期及时间对象日期及时间对象：提供有关日期和时间的处理。动态性，即必须使用New运算符创建一个实例。例如：MyDate=NewDate();,常用对象的属性和方法,系统函数JavaScript中的系统函数又称内部方法。它提供了与任何对象无关的系统函数，使用这些函数不需创建任何实例,可直接用。,常用对象的属性和方法,DHTML的定义使用JavaScript和CSS级联样式表操作HTML创造出各种动态视觉效果统称为DHTMLDHTML是一种浏览器端的动态网页技术,DHTML对象模型,DHTML对象模型（DOM）将HTML标记、属性和CSS样式都对象化可以动态存取HTML文档中的所有元素可以使用属性name或id来存取或标记对象改变元素内容或样式后浏览器中显示效果即时更新DHTML对象模型包括浏览器对象模型和Document对象模型,DHTML对象模型,Window,Frames,History,Navigator,Document,Location,Event,Form,Table,Anchor,Image,Iframe,.,DHTML对象模型,Javascript中具有一些网页对象，比如navigator对象、document对象和window对象等。这些对象向我们提供了与Web浏览器的一些接口。,常用对象的属性和方法,1）窗口对象(Windows)。Window对象处于对象层次的最顶端，其他对象都可以看做是window对象的属性。2）浏览器对象(Navigator)。提供有关浏览器的信息3）位置对象(Location)。Location对象提供了与当前打开的URL一起工作的方法和属性，它是一个静态的对象。,常用对象的属性和方法,4）历史对象(History)。History对象提供了与历史清单有关的信息。5）文档对象(Document)。表示当前浏览器中的HTML文档，通过该对象能获得当前文档的信息，可检测和修改文档的元素，包含了与文档元素一起工作的对象，它将这些元素封装起来供编程人员使用。,常用对象的属性和方法,Window对象是指浏览器窗口本身。一、使用window对象使用window和self标志符来引用当前的浏览器窗口。在窗口框架中，用top标志引用最上层的窗口，用parent标志符来引用当前窗口的父窗口。,window对象,主要功能窗口的打开和关闭对话框状态栏定时器内容滚动调整窗口大小和位置Screen对象History对象Navigator对象Location对象,window对象,window对象,常用方法,window对象,常用方法,window对象,窗口的打开和关闭.,.窗口的打开和关闭.,config参数具体元素menubar菜单条toolbar工具条location地址栏directories链接status状态栏scrollbars滚动条resizeable可调整大小width窗口宽，以像素为单位height窗口高，以像素为单位,参数值为yes或no,参数值为数字值,.窗口的打开和关闭,程序示范：打开google搜索窗口,varconfig=menubar=yes,toolbar=no,location=no,;config+=directories=no,status=yes,;config+=scrollbars=yes,resizable=yes,;config+=width=500,height=300;varopenurl=;window.open(openurl,popwin,config);/仅仅打开窗口,varmywin=window.open(openurl,popwin,config);mywin.close();/关闭打开的窗口,对话框,分类,对话框,简单对话框,窗口对话框,alert提示框,confirm确认框,prompt输入框,showModalDialog(IE4.0),showModelessDialog(IE5.0),简单对话框.,.简单对话框.,显示效果比较：,alert(您好！);confirm(您好吗？);prompt(您贵姓？,陈);,.简单对话框,返回值比较：,varfirstname=prompt(您贵姓？,陈);if(confirm(您确定？)=true)alert(firstname+先生，您好！);,不返回值,窗口对话框.,参数说明url打开链接arguments传入参数config窗口配置参数,.窗口对话框.,config外观配置参数status状态栏resizable可调整大小help是否显示标题栏中的按钮center是否显示在桌面正中间dialogWidth对话框宽dialogHeight对话框高dialogTop对话框左上角的y坐标dialogLeft对话框左上角的x坐标,参数值为yes或no,值为数字单位为像素,.functionshowDialog()varconfig=dialogWidth:320px;dialogHeight:180px;config+=dialogTop:140px;dialogLeft:250px;config+=center:no;help:no;resizable:no;status:no;showModalDialog(test4-1a.htm,input1,config);.,.窗口对话框.,程序示范：调用窗口对话框的方法,传入input1对象,/确定按钮事件，更新输入框中的值functionok()vartheInput=dialogArguments;.theInput.value=theYear+-+theMonth+-+theDate;window.close();,.窗口对话框.,程序示范：窗口对话框页面的编写,设置传入对象input1的值,.窗口对话框.,运行结果：选择日期对话框,调用页,被调用对话框,状态栏,window.status=hello;,varstr=您好！今天是+(newDate().toLocaleString();window.status=str;,定时器.,.定时器.,定时器的实际运用网页动态时钟制作倒计时跑马灯效果幻灯片效果自动滚屏阅读制作网页小游戏,.vartimmerID=null;functionupdateTime()/更新状态栏显示当前时间varnow=(newDate().toLocaleString();window.status=当前时间：+now;functionmystart()/启动定时器timmerID=window.setInterval(updateTime(),1000);functionmystop()/停止定时器window.clearInterval(timmerID);/调用mystart();,.定时器.,程序示范：网页动态时钟(采用setInterval),.定时器.,程序示范：网页动态时钟(采用setTimeout),.vartimmerID=null;functionupdateTime()/更新状态栏显示当前时间varnow=(newDate().toLocaleString();window.status=当前时间：+now;mystart();functionmystart()/启动定时器timmerID=window.setTimeout(updateTime(),1000);functionmystop()/停止定时器window.clearTimeout(timmerID);.mystart();,.定时器,运行结果：网页动态时钟,状态栏中的时间信息将每秒种刷新一次,内容滚动.,.内容滚动,程序示范：自动滚屏阅读,.vartimmerID=null;functionupdateScroll()/更新滚动位置window.scrollBy(0,1);functionmystart()/启动定时器timmerID=window.setInterval(updateScroll(),100);functionmystop()/停止定时器window.clearInterval(timmerID);.,调整窗口大小和位置.,.窗口移动,程序示范：会摇头的窗口,varSTEPSIZE=10;/定义移动的步长vartimmerID=null,tempx=STEPSIZE;functionupdateMove()/更新移动位置if(window.screenLeft500)tempx=-STEPSIZE;if(window.screenLeft100)tempx=STEPSIZE;window.moveBy(tempx,0);functionmystart()/启动定时器window.resizeTo(400,300);timmerID=window.setInterval(updateMove(),10);functionmystop()/停止定时器window.clearInterval(timmerID);,Document对象,Document对象具有强大的组织性。例如：给页面中的元素起了名字，则可以把该元素当成document对象的一个属性来处理。如果在form元素”form1”中有一个名叫“txtbox”的文本框，则可以像下面这样去引用该文本框中的文本：document.form1.txtbox.value,Document对象,程序示范获取上次修改时间标题栏动态修改背景颜色调整,document.write(最后修改时间：+document.lastModified);document.title=欢迎进入JavaScript世界;document.bgColor=#EFEFEF;/设置背景为灰色document.fgColor=red;/设置字体为红色,Document对象,数组,Document对象,数组对象的调用根据对象索引号，如forms0代表文档中第一个表单根据对象名称，如forms“myform代表名称为form1的表单直接对象调用，如document.form1,Document对象,关键方法,Document对象,程序示范：输出内容到弹出新窗口,varmyWin=window.open();/打开新窗口myWin.document.open();/初始化显示文档myWin.document.write(直接输出；);myWin.document.writeln(1.输出后换行);myWin.document.writeln(2.输出后换行);myWin.document.writeln(3.输出后换行);myWin.document.close();/关闭文档,如果不指定Window对象则代表直接操作当前窗口的Document对象,Document对象,程序结果：,writeln输出的换行符在原代码中可以看到,Document对象,Screen对象.,对象介绍属于window的子对象常用于获取屏幕的分辨率和色彩,.Screen对象,应用例子：窗口最大化,window.moveTo(0,0);window.resizeTo(screen.availWidth,screen.availHeight);,采用screen对象的分辨率属性和resizeTo方法来动态确定窗口最大长度和宽度,History对象.,对象介绍属于window的子对象常用于返回到已经访问过的页面,.History对象,应用例子：网页导航按钮,Navigator对象.,Navigator对象属于window的子对象，只有属性常用于获取客户端浏览器和操作系统信息常用的属性appCodeName浏览器的名称appVersion浏览器的版本和操作系统名称userLanguage用户语系cookieEnable是否支持cookie,.Navigator对象.,获取Navigator对象的所有属性,varshowtext=Navigator对象属性列表：n;for(varpropnameinnavigator)showtext+=propname+:+navigatorpropname+n;alert(showtext);,.Navigator对象,Mozilla下运行的结果,Location对象.,Location对象属于window的子对象常用于获取和改变当前浏览的网址常用的属性href当前窗口正在浏览的网页地址replace(url)转向到url网页地址reload()重新载入当前网址，同按下刷新按钮,.Location对象,获取Location对象的所有属性,varshowtext=Location对象属性列表：n;for(varpropnameinlocation)showtext+=propname+:+locationpropname+n;alert(showtext);,内置对象的分类.,11种内置对象包括Array,Boolean,Date,Math,Number,StringError,Function,Global,Object,RegExp简介在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象可以用创建对象的方法定义变量String、Math、Array、Date是JavaScript中常用的对象,.内置对象的分类,创建String对象,自动创建字符串对象手工创建字符串对象,varstr1=helloworld;alert(str1.length);alert(str1.substr(1,5);,varstr1=newString(helloword);alert(str1.length);alert(str1.substr(1,3);,调用字符串的对象属性或方法时自动创建对象，用完就丢弃,采用new创建字符串对象str1，全局有效,String对象的属性,获取字符串长度length,获取字符串长度,书写格式x.length使用注解x代表字符串对象length必须小写中间用点操作符调用汉字、字母长度均为1返回大于或等于0整数,varstr1=String对象;varstr2=;alert(str1长度+str1.length);alert(str2长度+str2.length);,String对象的方法,String对象的方法分类,String对象方法,格式编排方法,大小写转换,获取指定字符,查询字符串,子字符串处理,截取,替换,分割,连接,String对象的方法(1).,.String对象的方法(1)-,书写格式string对象提供了一组针对HTML格式的方法，如x.anchor()返回锚定义字符串x，x.bold()返回粗体表示字符串x，x.sup()返回上标格式字符串x举例说明,varx=google;vary=x.bold():+x.bold();document.write(y.fontsize(7);/相当于document.write(google),.String对象的方法(1)-,格式编排方法返回值列表,.String对象的方法(1)-,格式编排方法返回值列表,.String对象的方法(1)-,使用范例,functionwriteln(mystr)document.write(mystr+);varx=hello;writeln(anchor=+x.anchor();writeln(blink=+x.blink();writeln(fixed=+x.fixed();writeln(bold=+x.bold();writeln(italics=+x.italics();writeln(strike=+x.strike();writeln(big=+x.big();writeln(small=+x.small();writeln(sub=+x.sub();writeln(sup=+x.sup();,String对象的方法(2),String对象的方法(2)-大小写转换.,书写格式x.toLowerCase()x.toUpperCase()使用注解x代表字符串对象返回转换后的字符串,varstr1=AbcdEfgh;varstr2=str1.toLowerCase();varstr3=str1.toUpperCase();alert(str2);/结果为abcdefghalert(str3);/结果为ABCDEFGH,.String对象的方法(2)-大小写转换,程序图解,varstr1=AbcdEfgh;,varstr2=str1.toLowerCase();,alert(str2);/结果为abcdefgh,varstr3=str1.toUpperCase();,alert(str3);/结果为ABCDEFGH,String对象的方法(2)-获取指定字符.,书写格式x.charAt(index)x.charCodeAt(index)使用注解x代表字符串对象index代表字符位置index从0开始编号charAt返回index位置的字符charCodeAt返回index位置的Unicode编码,varstr1=JavaScript网页教程;varstr2=str1.charAt(12);varstr3=str1.charCodeAt(12);alert(str2);/结果为教alert(str3);/结果为25945,.String对象的方法(2)-获取指定字符,程序图解,varstr1=JavaScript网页教程;,varstr2=str1.charAt(12);,varstr3=str1.charCodeAt(12);,alert(str2);/结果为教alert(str3);/结果为25945,教,25945,String对象的方法(2)-查询字符串.,书写格式x.indexOf(findstr,index)x.lastIndexOf(findstr)使用注解x代表字符串对象findstr代表查找的字符串index代表开始找的位置索引，省略代表从开始找返回findstr在x中出现的首字符位置索引，如果没有找到返回-1lastIndexOf代表从后面找起,varstr1=JavaScript网页教程;varstr2=str1.indexOf(a);varstr3=str1.lastIndexOf(a);alert(str2);/结果为1alert(str3);/结果为3,.String对象的方法(2)-查询字符串.,程序图解,varstr1=JavaScript网页教程;,varstr2=str1.indexOf(a);,varstr3=str1.lastIndexOf(a);,alert(str2);/结果为1alert(str3);/结果为3,.String对象的方法(2)-查询字符串.,书写格式x.match(regexp)x.search(regexp)使用注解x代表字符串对象regexp代表正则表达式或字符串match返回匹配字符串的数组，如果没有匹配则返回nullsearch返回匹配字符串的首字符位置索引,varstr1=JavaScript网页教程;varstr2=str1.match(Script);varstr3=str1.search(Script);alert(str20);/结果为Scriptalert(str3);/结果为4,.String对象的方法(2)-查询字符串,程序图解,varstr1=JavaScript网页教程;,varstr2=str1.match(Script);,varstr3=str1.search(Script);,alert(str20);/结果为Scriptalert(str3);/结果为4,match返回的是字符串数组,search的作用同indexOf方法,String对象的方法(3),String对象的方法(3)-获取子字符串.,书写格式x.substr(start,length)x.substring(start,end)使用注解x代表字符串对象start表示开始位置length表示截取长度end是结束位置加1第一个字符位置为0,varstr1=abcdefgh;varstr2=str1.substr(2,4);varstr3=str1.substring(2,4);alert(str2);/结果为cdefalert(str3);/结果为cd,.String对象的方法(3)-获取子字符串.,程序图解,varstr1=abcdefgh;,varstr2=str1.substr(2,4);,varstr3=str1.substring(2,4);,alert(str2);/结果为cdef,从索引为2的字符开始，截取四个字符,从索引为2的字符开始，到索引为3的字符为止,alert(str3);/结果为cd,.String对象的方法(3)-获取子字符串.,书写格式x.slice(start,end)使用注解x代表字符串对象start表示开始位置索引end是结束位置下一字符索引编号第一个字符索引为0start、end可为负数-1代表最后一个字符end省略则相当于从start位置开始截取以后所有字符,varstr1=abcdefgh;varstr2=str1.slice(2,4);varstr3=str1.slice(4);varstr4=str1.slice(2,-1);varstr5=str1.slice(-3,-1);alert(str2);/结果为cdalert(str3);/结果为efghalert(str4);/结果为cdefgalert(str5);/结果为fg,.String对象的方法(3)-获取子字符串,程序图解,varstr1=abcdefgh;,varstr2=str1.slice(2,4);varstr3=str1.slice(4);varstr4=str1.slice(2,-1);varstr5=str1.slice(-3,-1);alert(str2);/结果为cdalert(str3);/结果为efghalert(str4);/结果为cdefgalert(str5);/结果为fg,String对象的方法(3)-替换子字符串.,书写格式x.replace(findstr,tostr)使用注解x代表字符串对象findstr要找的子字符串tostr替换为的字符串返回替换后的字符串,varstr1=abcdefgh;varstr2=str1.replace(cd,aaa);alert(str2);/结果为abaaaefgh,.String对象的方法(3)-替换子字符串,程序图解,varstr1=abcdefgh;,varstr2=str1.replace(cd,aaa);,alert(str2);/结果为abaaaefgh,将str1字符串中的子字符串cd替换为aaa,String对象的方法(3)-分割字符串.,书写格式x.split(bystr)使用注解x代表字符串对象bystr作为分割字符串返回分割后的字符串数组,varstr1=一,二,三,四,五,六,日;varstrArray=str1.split(,);alert(strArray1);/结果为二,.String对象的方法(3)-分割字符串,程序图解,varstr1=一,二,三,四,五,六,日;,varstrArray=str1.split(,);,alert(strArray1);/结果为二,生成的数组元素编号是从0开始编号的，所以索引1指的是第二个元素,String对象的方法(3)-连接字符串.,书写格式y=x.concat(addstr)使用注解x代表字符串对象addstr为添加字符串返回x+addstr字符串,varstr1=abcd;varstr2=str1.concat(efgh);alert(str2);/结果为abcdefgh,.String对象的方法(3)-连接字符串,程序图解,varstr1=abcd;,varstr2=str1.concat(efgh);,alert(str2);/结果为abcdefgh,将str1与字符串efgh相加后赋值给str2，但是str1自身的值不发生变化,+,创建Array对象.,创建数组对象初始化数组对象,varcnweek=newArray(7);varbooks=newArray();,创建数组时允许指定元素个数也可以不指定元素个数,也可以直接在建立对象时初始化数组元素，元素类型允许不同,varcnweek=newArray(7);cnweek0=星期日;cnweek1=星期一;week6=星期六;,vartest=newArray(100,a,true);,.创建Array对象,创建二维数组,varcnweek=newArray(7);for(vari=0;i=6;i+)cnweeki=newArray(2);cnweek00=星期日;cnweek01=Sunday;cnweek10=星期一;cnweek11=Monday;week60=星期六;cnweek61=Saturday;,通过指定数组中的元素为数组的方式可以创建二维甚至多维数组,Array对象的属性,获取数组元素的个数length,获取数组元素的个数,书写格式x.length使用注解x代表数组对象length必须小写中间用点操作符调用返回大于或等于0整数,varcnweek=newArray(7);cnweek0=星期日;cnweek1=星期一;cnweek2=星期二;cnweek3=星期三;cnweek4=星期四;cnweek5=星期五;cnweek6=星期六;for(vari=0;icnweek.length;i+)document.write(cnweeki+|);,Array对象的方法,连接数组.,书写格式x.join(bystr)x.toString()使用注解x代表数组对象bystr作为连接数组中元素的字符串返回连接后的字符串与字符串的split功能刚好相反,vararr1=1,2,3,4,5,6,7;varstr1=arr1.join(-);alert(str1);/结果为1-2-3-4-5-6-7,.连接数组,程序图解,vararr1=1,2,3,4,5,6,7;,alert(str1);/结果为1-2-3-4-5-6-7,根据join方法传入参数-将元素连接成字符串,varstr1=arr1.join(-);,.连接数组.,书写格式x.concat(value,.)使用注解x代表数组对象value作为数组元素连接到数组的末尾返回连接后的数组concat方法并不改变x自身的值,vara=1,2,3;Vara=newArray(1,2,3)varb=a.concat(4,5);alert(a.toString();/返回结果为1,2,3alert(b.toString();/返回结果为1,2,3,4,5,.连接数组,程序图解,vara=1,2,3;,varb=a.concat(4,5);,alert(a.toString();/返回结果为1,2,3alert(b.toString();/返回结果为1,2,3,4,5,a,b,数组排序.,书写格式x.reverse()x.sort()使用注解x代表数组对象返回排序后的数组排序后x会发生改变,vararr1=32,12,111,444;arr1.reverse();/颠倒数组元素alert(arr1.toString();/结果为444,111,12,32arr1.sort();/排序数组元素alert(arr1.toString();/结果为111,12,32,444,.数组排序,程序图解,vararr1=32,12,111,444;,arr1.reverse();/颠倒数组元素alert(arr1.toString();/结果为444,111,12,32,arr1.sort();/排序数组元素alert(arr1.toString();/结果为111,12,32,444,Array对象的方法,获取子数组.,书写格式x.slice(start,end)使用注解x代表数组对象start表示开始位置索引end是结束位置下一数组元素索引编号第一个数组元素索引为0start、end可为负数，-1代表最后一个数组元素end省略则相当于从start位置截取以后所有数组元素,vararr1=a,b,c,d,e,f,g,h;vararr2=arr1.slice(2,4);vararr3=arr1.slice(4);vararr4=arr1.slice(2,-1);alert(arr2.toString();/结果为c,dalert(arr3.toString();/结果为e,f,g,halert(arr4.toString();/结果为c,d,e,f,g,.获取子数组.,程序图解,slice(2,4),slice(4),slice(2,-1),.删除子数组.,书写格式x.splice(start,deleteCount,value,.)使用注解x代表数组对象splice的主要用途是对数组指定位置进行删除和插入start表示开始位置索引deleteCount删除数组元素的个数value表示在删除位置插入的数组元素value参数可以省略,vara=1,2,3,4,5,6,7,8a.splice(1,2);/a变为1,4,5,6,7,8alert(a.toString();a.splice(1,1);/a变为1,5,6,7,8alert(a.toString();a.splice(1,0,2,3);/a变为1,2,3,5,6,7,8alert(a.toString();,.删除子数组,程序图解,splice(1,2),splice(1,1),splice(1,0,2,3),进出栈操作.,书写格式x.push(value,.)x.pop()使用注解x代表数组对象value可以为字符串、数字、数组等任何值push是将value值添加到数组x的结尾pop是将数组x的最后一个元素删除,vararr1=1,2,3;arr1.push(4,5);alert(arr1);/结果为1,2,3,4,5arr1.push(6,7);alert(arr1)/结果为1,2,3,4,5,6,7arr1.pop();alert(arr1);/结果为1,2,3,4,5,.进出栈操作.,程序图解,push(4,5),push(6,7),pop(),.进出栈操作.,书写格式x.unshift(value,.)x.shift()使用注解x代表数组对象value可以为字符串、数字、数组等任何值unshift是将value值插入到数组x的开始shift是将数组x的第一个元素删除,vararr1=1,2,3;arr1.unshift(4,5);alert(arr1);/结果为4,5,1,2,3arr1.unshift(6,7);alert(arr1)/结果为6,7,4,5,1,2,3arr1.shift();alert(arr1);/结果为4,5,1,2,3,.进出栈操作,程序图解,unshift(4,5),unshift(6,7),pop(),Math对象的属性.,Math对象的属性都是数学常数Math.E（自然数）Math.LN2（ln2）Math.LN10（ln10）Math.LOG2E（log2e）Math.LOG10E（loge）Math.PI（圆周率）Math.SQRT1_2（根号1/2）Math.SQRT2（根号2）,.Math对象的属性,用程序获取Math属性的值,/定义换行输出函数functionwriteln(mystr)document.write(mystr+);/输出Math属性writeln(E=+Math.E);writeln(LN2=+Math.LN2);writeln(LN10=+Math.LN10);writeln(LOG2E=+Math.LOG2E);writeln(LOG10E=+Math.LOG10E);writeln(PI=+Math.PI);writeln(SQRT1_2=+Math.SQRT1_2);writeln(SQRT2=+Math.SQRT2);,Math对象的方法.,.Math对象的方法.,.Math对象的方法.,程序示范,functionwriteln(mystr)document.write(mystr+);varx=0.5;vary=0.8;writeln(sin(+x+)=+Math.sin(x);writeln(cos(+x+)=+Math.cos(x);writeln(tan(+x+)=+Math.tan(x);writeln(asin(+x+)=+Math.asin(x);writeln(acos(+x+)=+Math.acos(x);writeln(atan(+x+)=+Math.atan(x);writeln(atan2(+y+,+x+)=+Math.atan2(y,x);,.Math对象的方法.,.Math对象的方法.,程序示范,functionwriteln(mystr)document.write(mystr+);varx=3;vary=4;writeln(sqrt(+x+)=+Math.sqrt(x);writeln(pow(+x+,+y+)=+Math.pow(x,y);writeln(exp(+x+,+y+)=+Math.exp(x,y);writeln(log(+x+)=+Math.log