《網(wǎng)頁(yè)設(shè)計(jì)與制作（HTML+CSS+JavaScript）》課件-CORE-12

第十二章表單、其它對(duì)象的應(yīng)用目標(biāo)理解表單、其它對(duì)象的應(yīng)用范圍。掌握表單、其它對(duì)象的應(yīng)用技術(shù)。概述、專(zhuān)業(yè)術(shù)語(yǔ)表單最主要的應(yīng)用是保存、處理、傳送數(shù)據(jù)，響應(yīng)Web控件發(fā)生的事件。其它對(duì)象的應(yīng)用。這些對(duì)象包括Navigator、History以及其它一些方法。術(shù)語(yǔ)詞匯表定義在此章節(jié)中使用的術(shù)語(yǔ)簡(jiǎn)易計(jì)算器計(jì)算器的制作簡(jiǎn)易計(jì)算器計(jì)算器的制作——設(shè)計(jì)界面<formname="sc"> <inputtype="text"name="box"size=15><br> <inputtype="button"value="7"> <inputtype="button"value="8"> <inputtype="button"value="9"><br> <inputtype="button"value="4"> <inputtype="button"value="5"> <inputtype="button"value="6"><br> <inputtype="button"value="1"> <inputtype="button"value="2"> <inputtype="button"value="3"><br> <inputtype="button"value="0"> <inputtype="button"value="+"> <inputtype="button"value="-"><br> <inputtype="button"value="*"> <inputtype="button"value="/"> <inputtype="button"value="="></form>簡(jiǎn)易計(jì)算器計(jì)算器的制作——編寫(xiě)js處理函數(shù)<scriptlanguage="JavaScript">varst=0;//用于記錄計(jì)算結(jié)果

varopertr;//用于保存運(yùn)算符

//根據(jù)傳入的參數(shù)的不同進(jìn)行不同的處理

functioncount(t){ //代碼

}

//運(yùn)算,將結(jié)果保存在變量st中

functionoper(){ //代碼

}</script>簡(jiǎn)易計(jì)算器計(jì)算器的制作——給界面按鈕添加事件處理<formname="sc"> <inputtype="text"name="box"size=15><br> <inputtype="button"value="7"onClick="count(7)"> <inputtype="button"value="8"onClick="count(8)"> <inputtype="button"value="9"onClick="count(9)"><br> <inputtype="button"value="4"onClick="count(4)"> <inputtype="button"value="5"onClick="count(5)"> <inputtype="button"value="6"onClick="count(6)"><br> <inputtype="button"value="1"onClick="count(1)"> <inputtype="button"value="2"onClick="count(2)"> <inputtype="button"value="3"onClick="count(3)"><br> <inputtype="button"value="0"onClick="count(0)"> <inputtype="button"value="+"onClick="count(‘+’)"> <inputtype="button"value="-"onClick="count(‘-’)"><br> <inputtype="button"value="*"onClick="count(‘*’)"> <inputtype="button"value="/"onClick="count(‘/’)"> <inputtype="button"value="="onClick="count(‘=‘)"></form>簡(jiǎn)易計(jì)算器計(jì)算器的制作——運(yùn)行導(dǎo)航欄水平導(dǎo)航下拉菜單欄的制作導(dǎo)航欄制作主要分為三大部分：HTML部分、CSS部分和JavaScript部分。下面我們首先看一下它的html部分。示例代碼12-2效果如下導(dǎo)航欄接下來(lái)我們編寫(xiě)相關(guān)的JavaScript函數(shù)示例代碼見(jiàn)課本12-3效果如下導(dǎo)航欄functionsetMouseActions(node){ node.onMouseOver=function() //當(dāng)鼠標(biāo)懸浮在此節(jié)點(diǎn)上時(shí)觸發(fā)鼠標(biāo)懸浮事件調(diào)用function()函數(shù)

//function()是匿名函數(shù)標(biāo)識(shí)

{this.getElementsByTagName("ul")[0].style.display="block"; //顯示此li節(jié)點(diǎn)下的第一個(gè)ul標(biāo)簽內(nèi)容} node.onMouseOut=function() //當(dāng)鼠標(biāo)移開(kāi)此節(jié)點(diǎn)時(shí)觸發(fā)onMouseOut事件調(diào)用function()函數(shù)

{this.getElementsByTagName("ul")[0].style.display="none"; //隱藏此li節(jié)點(diǎn)下的第一個(gè)ul標(biāo)簽內(nèi)容}}級(jí)聯(lián)效果在網(wǎng)頁(yè)中實(shí)現(xiàn)級(jí)聯(lián)效果請(qǐng)看相關(guān)的代碼部分見(jiàn)課本12-3效果如下總結(jié)本章介紹了對(duì)象的綜合應(yīng)用。通過(guò)本章的學(xué)習(xí)，可以使大家掌握J(rèn)avaScript通過(guò)表單等對(duì)象來(lái)處理數(shù)據(jù)、控制輸入以及實(shí)現(xiàn)網(wǎng)站