摘要:可以創(chuàng)建一個(gè)函數(shù)并讓它返回一個(gè)數(shù)值一個(gè)字符串一個(gè)數(shù)組或一個(gè)布爾值。操作符可以告訴我們它的操作數(shù)是一個(gè)字符串?dāng)?shù)值函數(shù)布爾值還是對(duì)象,例如在瀏覽器中加載這個(gè)例子時(shí),會(huì)彈出一個(gè)對(duì)話框,報(bào)告的類型它是一個(gè)對(duì)象。
函數(shù)
如果需要多次使用同一段代碼,可以把它們封裝成一個(gè)函數(shù)。函數(shù)就是一組允許在你的代碼里隨時(shí)調(diào)用的語句。事實(shí)上,每個(gè)函數(shù)實(shí)際是一個(gè)短小的腳本。
先對(duì)函數(shù)做出定義再調(diào)用是一個(gè)良好的編程習(xí)慣。下面是一個(gè)簡單的示例函數(shù):
function shout() { var beatles = Array("John","Paul","George","Ringo"); for (var count = 0; count < beatles.length; count++ ) { alert(beatles[count]); } }
這個(gè)函數(shù)里的循環(huán)語句將依次彈出對(duì)話框來顯示Beatles樂隊(duì)成員的名字。如果想在自己的腳本里執(zhí)行這一動(dòng)作,可以隨時(shí)使用如下的語句來調(diào)用這個(gè)函數(shù):
shout();
每當(dāng)需要反復(fù)做一件事,都可以利用函數(shù)來避免重復(fù)鍵入大量的相同內(nèi)容??梢詫⒉煌臄?shù)據(jù)傳遞給它們,而它們將使用這些數(shù)據(jù)去完成預(yù)定的操作。傳遞給函數(shù)的數(shù)據(jù)稱為參數(shù)(argument)。
定義一個(gè)函數(shù)的語法:
function name(arguments) { statements; }
JavaScript提供了許多內(nèi)建函數(shù),在前面多次出現(xiàn)過的alert就是一例。這個(gè)函數(shù)需要我們提供一個(gè)參數(shù),它將彈出一個(gè)對(duì)話框來顯示這個(gè)參數(shù)的值。
在定義函數(shù)時(shí),可以為它聲明任意多個(gè)參數(shù),只要用逗號(hào)把它們分隔開來就行。在函數(shù)額內(nèi)部,你可以像使用普通變量那樣使用它的任何一個(gè)參數(shù)。
下面是一個(gè)需要傳遞兩個(gè)參數(shù)的函數(shù)。如果把兩個(gè)數(shù)值傳遞給這個(gè)函數(shù),這個(gè)函數(shù)將對(duì)它們進(jìn)行乘法運(yùn)算:
function multiply(num1,num2) { vartotal = num1 * num2; alert(total); }
在定義了這個(gè)函數(shù)的腳本里,我們可以從任意位置去調(diào)用這個(gè)函數(shù),如下所示:
multiply(10,2);
屏幕上會(huì)立刻彈出一個(gè)顯示乘法運(yùn)算結(jié)果(20)的alert對(duì)話框。函數(shù)不僅能夠(以參數(shù)的形式)接收數(shù)據(jù),還能夠返回?cái)?shù)據(jù)。
可以創(chuàng)建一個(gè)函數(shù)并讓它返回一個(gè)數(shù)值、一個(gè)字符串、一個(gè)數(shù)組或一個(gè)布爾值。這需要用到return語句:
function multiply(num1,num2) { var total = num1 * num2; return total; }
下面這個(gè)函數(shù)只有一個(gè)參數(shù)(一個(gè)華氏溫度值),它將返回一個(gè)數(shù)值(同一溫度的攝氏溫度值):
function converToCelsius(temp) { var result = temp - 32; result = result / 1.8; return result; }
還可以把函數(shù)當(dāng)做一種數(shù)據(jù)類型來使用,這意味著可以把一個(gè)函數(shù)的調(diào)用結(jié)果賦給一個(gè)變量:
var temo_fahrenheit = 95; var temp_celsius = convertToCelsius(temp_fahrenheit); alert(temp_celsius);
把華氏溫度值95轉(zhuǎn)換為攝氏溫度值。這個(gè)例子中,變量temp_celsius的值將是35,這個(gè)數(shù)值由convertToCelsius函數(shù)返回。
變量的作用域比如下面這個(gè)例子:
function square(num) { total = num * num; return total; } var total = 50; var number = square(20); alert(total);
全局變量total的值變成了400。本意是讓square()函數(shù)只把它計(jì)算出來的平方值返回給變量number,但因?yàn)槲窗堰@個(gè)函數(shù)內(nèi)部的total變量明確地聲明為局部變量,這個(gè)函數(shù)把名字同樣是total的那個(gè)全局變量的值也改變了。
把這個(gè)函數(shù)寫成如下所示的樣子才是正確的:
function square(num) { var total = num * num; return total; }
現(xiàn)在,全局變量total變得安全了,再怎么調(diào)用square()函數(shù)也不會(huì)影響到它、
請(qǐng)記住,函數(shù)在行為方面應(yīng)該像一個(gè)自給自足的腳本,在定義一個(gè)函數(shù)式,一定要把它內(nèi)部的變量全部明確地聲明為局部變量。如果你總是在函數(shù)里使用var關(guān)鍵字來定義變量,就能避免任何形式的二定義隱患。
獲取元素有3種DOM方法可獲取元素節(jié)點(diǎn),分別是通過元素ID、通過標(biāo)簽名字和通過類名字來獲取。
getElementByIdDOM提供了一個(gè)名為getElementById的方法,這個(gè)方法將返回一個(gè)與那個(gè)有著給定id屬性值的元素節(jié)點(diǎn)對(duì)應(yīng)的對(duì)象。
它是document對(duì)象特有的函數(shù)。在腳本代碼里,函數(shù)名的后面必須跟有一對(duì)圓括號(hào),這對(duì)圓括號(hào)包含著函數(shù)的參數(shù)。getElementById方法只有一個(gè)參數(shù):你想獲得的那個(gè)元素的id屬性的值,這個(gè)id值必須防止單引號(hào)或雙引號(hào)里。
document.getElementById(id)
下面是一個(gè)例子:
document.getElementById("purchases")
這個(gè)調(diào)用將返回一個(gè)對(duì)象,這個(gè)對(duì)象對(duì)應(yīng)著document對(duì)象里的一個(gè)獨(dú)一無二的元素,那個(gè)元素的HTMLid屬性值是purchases。你可以用typeof操作符來驗(yàn)證這一點(diǎn)。typeof操作符可以告訴我們它的操作數(shù)是一個(gè)字符串、數(shù)值、函數(shù)、布爾值還是對(duì)象,例如:
Shopping list What to buy
Don"t forget to buy this stuff.
在瀏覽器中加載這個(gè)例子時(shí),會(huì)彈出一個(gè)alert對(duì)話框,報(bào)告document.getElementById("purchases")的類型————它是一個(gè)對(duì)象。
事實(shí)上,文檔中的每一個(gè)元素都是一個(gè)對(duì)象。利用DOM提供的方法能夠得到任何一個(gè)對(duì)象。
getElementsByTagNamegetElementsByTagName方法返回一個(gè)對(duì)象數(shù)組,每個(gè)對(duì)象分別對(duì)應(yīng)著文檔里有著給定標(biāo)簽的一個(gè)元素。類似于getElementById,這個(gè)方法也是只有一個(gè)參數(shù)的函數(shù),它的參數(shù)是標(biāo)簽的名字:
element.getElementsByTagName(tag)
它與getElementById方法有許多相似之處,但它返回的是一個(gè)數(shù)組。下面是一個(gè)例子:
document.getElementsByTagName("li")
這個(gè)調(diào)用將返回一個(gè)對(duì)象數(shù)組,每個(gè)對(duì)象分別對(duì)應(yīng)著document對(duì)象中的一個(gè)列表項(xiàng)元素。與任何其他的數(shù)組一樣,我們可以利用length屬性查出這個(gè)數(shù)組里的元素個(gè)數(shù)。
在之前的例子中將