JavaScript3

JAVASCRIPT浏览器对象知识回顾定义数组a，大小为10，存放的数据分别是1-10，对应的js代码为？希望知道数组的大小，使用哪个属性？代码阅读，请问输出结果是多少？SCRIPTlanguage=JavaScript“vara=3“,b=4;alert(isNaN(a));alert(a+++b);alert(eval(a+++b));/SCRIPT知识回顾代码阅读，请问输出结果是多少？SCRIPTlanguage=JavaScript“vars=abcdefg;alert(s.indexOf(cd,0));alert(s.substr(1,2));alert(Math.round(9.38));varnow=newDate();alert(now.getMonth());/SCRIPT内容摘要理解事件处理程序的概念了解JavaScript中的常用事件掌握常用的浏览器对象：•window•document•history事件处理事件是发生并得到处理的操作事件：电话振铃处理事件JAVASCRIPT事件处理程序JavaScript事件处理程序就是一组语句，在事件（如点击鼠标或移动鼠标等）发生时执行事件处理事件事件处理程序的基本语法是：事件名=JavaScript代码函数INPUTtype=”BUTTON”…onClick=“alert(“单击我！”);”INPUTtype=”BUTTON”…onMouseDown=“check()”表示鼠标按下时，将调用执行函数check()。JAVASCRIPT事件事件名说明onClick鼠标单击onChange文本内容或下拉菜单中的选项发生改变onFocus获得焦点，表示文本框等获得鼠标光标。onBlur失去焦点，表示文本框等失去鼠标光标。onMouseOver鼠标悬停，即鼠标停留在图片等的上方onMouseOut鼠标移出，即离开图片等所在的区域onMouseMove鼠标移动，表示在DIV层等上方移动onLoad网页文档加载事件onSubmit表单提交事件onMouseDown鼠标按下onMouseUp鼠标弹起cardpassmyformONFOCUS和ONBLUR事件-1HEADSCRIPTlanguage=JavaScriptfunctionmyfun1(){if(document.myform.card.value==请注意格式：10xxxxxx)document.myform.card.value=;}functionmyfun2(){vara=document.myform.card.value;if(a.substr(0,2)!=10||isNaN(a)){alert(格式错误，请重新输入);document.myform.card.focus();}}/SCRIPT/HEAD文本框获得鼠标焦点时（onFocus）调用的函数：清空卡号文本框文本框失去鼠标焦点时（onBlur）调用的函数：判断格式是否正确focus()方法再次获得焦点，即鼠标光标回到卡号文本框BODYFORMname=myformH2卡号：INPUTname=cardtype=textonFocus=myfun1()“value=请注意格式：10xxxxxx“onBlur=myfun2()BR密码：INPUTname=passtype=text/H2/FORM/BODYONFOCUS和ONBLUR事件-2添加事件处理ONMOUSEOVER和ONMOUSEDOWN事件HTMLHEADTITLE图片切换/TITLE/HEADBODYAhref==“dog1.jpg”name=“picture”width=“400”height=“155”onMouseOver=“src=‘dog2.jpg’”onMouseOut=“src=‘dog1.jpg’”低价转让哈士奇弟弟/AH1移过来看看俺啊/H1/BODY/HTML添加事件处理：切换图片onMouseOver=src='dog2.jpg'表示本图片的图片名称替换为dog2.jpg。请注意：由于外面两端已有双引号，为区别起见，dog2.jpg改用为单引号括起来。浏览器对象简介2-1浏览器对象的分层结构WINDOW对象7-1名称说明document表示给定浏览器窗口中的HTML文档。history包含有关客户访问过的URL的信息。location包含有关当前URL的信息。name设置或检索窗口或框架的名称。status设置或检索窗口底部的状态栏中的消息。screen包含有关客户端的屏幕和显示性能的信息。属性WINDOW对象7-2名称说明alert(“m提示信息)显示包含消息的对话框。confirm（“提示信息”）显示一个确认对话框，包含一个确定取消按钮Prompt（”提示信息“）弹出提示信息框open(url,name)打开具有指定名称的新窗口，并加载给定URL所指定的文档；如果没有提供URL，则打开一个空白文档close()关闭当前窗口setTimeout（”函数”,毫秒数）设置定时器：经过指定毫秒值后执行某个函数clearTimeout(定时器对象)WINDOW对象7-3HTMLHEADSCRIPTfunctionopenwindow(){window.open(google.htm);}functionclosewindow(){window.close();}/SCRIPT/HEADBODYFORMINPUTTYPE=buttonVALUE=打开窗口onClick=openwindow()INPUTTYPE=buttonVALUE=关闭窗口onClick=closewindow()/FORMBODY使用Open方法打开新窗口使用Close方法关闭窗口添加单击事件因为window是最顶层的根，所以可以省略window.open(google.htm);可简写为：open(google.htm);其他方法也是如此。WINDOW对象7-4open（”打开窗口的url”，”窗口名”，”窗口特征”）窗口的特征如下，可以任意组合：height：窗口高度；width：窗口宽度；top：窗口距离屏幕上方的象素值；left：窗口距离屏幕左侧的象素值；toolbar：是否显示工具栏，yes为显示；menubar，scrollbars表示菜单栏和滚动栏。resizable：是否允许改变窗口大小，yes或1为允许location：是否显示地址栏，yes或1为允许status：是否显示状态栏内的信息，yes或1为允许；我们需要预先制作好广告页面，假设为adv.htm，打开广告窗口的语句如下：open(“adv.htm”,“”,“toolbars=0,scrollbars=0,location=0,statusbars=0,menubars=0,resizable=0,width=650,height=150”);HTMLHEADSCRIPTlanguage=JavaScriptfunctionopenwindow(){open(adv.htm,,toolbars=0,scrollbars=0,location=0,statusbars=0,menubars=0,resizable=0,width=650,height=150);}/SCRIPT/HEADBODYonLoad=openwindow()H2看看和我一起打开的广告窗口/H2/BODY/HTMLWINDOW对象7-5使用Open方法打开广告新窗口添加页面加载事件1.插入一个层Layer1，z-index=1；2.层中插入一幅图片。WINDOW对象7-63.定时器函数setTimeout（）的用法：setTimeout（“调用的函数名”，间隔的毫秒数）表示每隔多少毫秒，就循环调用某个函数来执行清除某个定时器：clearTimeout（）方法。例如：varmyclock＝setTimeout（”move()”,500）;if(…)clearTimeout（myclock）;headscriptlanguage=JavaScriptfunctionmove(){document.getElementById(Layer1).style.left=Math.random()*500;document.getElementById(Layer1).style.top=Math.random()*500;setTimeout(move(),1000);}/script/headbodyonload=move()DIVid=Layer1style=position:absolute;left:14px;top:44px;width:150px;height:102px;z-index:1Ahref==piaofu.jpgwidth=150height=100border=0/A/DIVH2随机漂浮的广告/H2/BODYWINDOW对象7-7定义层图片移动的函数move()每隔1秒调用move()函数随机改变层的位置，从而实现随机漂浮的效果getElementById(“ID名称”)方法：根据ID名称获取HTML元素，这里表示获取层对象Layer1。left和top表示层Layer1的左边距和上边距，设定为随机的值。DOCUMENT对象3-1名称说明alinkColor设置或检索文档中所有活动链接的颜色bgColor设置或检索Document对象的背景色body指定文档正文的开始和结束linkColor设置或检索文档链接的颜色location包含关于当前URL的信息title包含文档的标题url设置或检索当前文档的URLvlinkColor设置或检索用户访问过的链接的颜色属性DOCUMENT对象3-2名称说明clear()清除当前文档close()关闭输出流并强制显示发送的数据write(text)将文本写入文档方法DOCUMENT对象3-3HTMLHEADTITLE无标题文档/TITLESCRIPTlanguage=JavaScriptfunctionchange(color){document.bgColor=color;}/SCRIPT/HEADBODYH2移过来我变色给你看看！/H2FONTsize=4SPANonMouseOver=change('red')变红色/SPAN|SPANonMouseOver=change('blue')变蓝色/SPAN|SPANonMouseOver=change('yellow')变黄色/SPAN/FONT/BODY利用document对象的bgColor属性改变背景色添加鼠标悬停事件HISTORY对象4-1history对象方法名称说明back()加载History列表中的上一个URLforward()加载History列表中的下一个URLgo(urlornumber)加载History列表中的一个URL，或要求浏览器移动指定的页面数。Back()方法相当于后退按钮forward()方法相当于前进按钮go(1)代表前进1页，等价于forward()方法；go(-1)代表后退1页，等价于back()方法；LOCATION对象4