譯者:Flyingis
編輯:Jaunt
原載:http://www.aygfsteel.com/flyingis/archive/2006/09/15/69888.html
this是JavaScript中功能最強大的關鍵字之一。
function
?doSomething()?
{
??
this
.style.color?
=
?'#cc0000';
}
在JavaScript中,this通常指向的是我們正在執行的函數本身,或者是,指向該函數所屬的對象。當我們在頁面中定義了函數doSomething()的時候,或者是JavaScript中的window對象(或global對象)。對于一個onclick屬性,它為它所屬的HTML元素所擁有,this應該指向該HTML元素。
這種“所有權”就是JavaScript中面向對象的一種方式。?
Copying
??
因此如果我們想充分利用this,我們不得不注意使用this的函數應該被正確的HTML元素所擁有。換句話說,我們應該復制這個函數到我們的onclick屬性。
element.onclick?
=
?doSomething;
這個函數被完整復制到onclick屬性(現在成為了函數)。因此如果這個event handler被執行,this將指向HTML元素,并且該元素的顏色得以改變。
這樣你就可以最大限度使用this。每當執行該函數,this所指向的HTML元素都正確響應事件,這些HTML元素擁有doSomething()的一個拷貝。
Referring
然而,如果你使用inline event registration(內聯事件注冊)
<element?onclick="doSomething()">
你將不能拷貝該函數!反而這種差異是非常關鍵的。onclick屬性并不包含實際的函數,僅僅是一個函數調用。
doSomething();
因此,它將聲明“轉到doSomething()并且執行它”。當我們到達doSomething(),this關鍵字又重新指向了全局的window對象,函數返回錯誤信息。
如果你想使用this來指向HTML元素響應的事件,你必須確保this關鍵字被寫在onclick屬性里。只有在這種情況下它才指向event handler所注冊的HTML元素。
?
element.onclick?=?doSomething;
alert(element.onclick)
你將得到
function?doSomething()?{
??this.style.color?=?'#cc0000';
}
正如你所見,this關鍵字被展現在onclick函數中,因此它指向HTML元素。
但是如果執行
<element?onclick="doSomething()">
alert(element.onclick)
你將得到
function?onclick()?{
??doSomething()
}
這僅僅是到doSomething()函數的一個引用。this關鍵字并沒有出現在onclick函數中,因此它不指向HTML元素。
編輯:Jaunt
原載:http://www.aygfsteel.com/flyingis/archive/2006/09/15/69888.html
this是JavaScript中功能最強大的關鍵字之一。
Owner
接下來文章中我們將要討論的問題是:在函數doSomething()中this所指的是什么?



在JavaScript中,this通常指向的是我們正在執行的函數本身,或者是,指向該函數所屬的對象。當我們在頁面中定義了函數doSomething()的時候,或者是JavaScript中的window對象(或global對象)。對于一個onclick屬性,它為它所屬的HTML元素所擁有,this應該指向該HTML元素。
這種“所有權”就是JavaScript中面向對象的一種方式。?
Copying
??
因此如果我們想充分利用this,我們不得不注意使用this的函數應該被正確的HTML元素所擁有。換句話說,我們應該復制這個函數到我們的onclick屬性。

這個函數被完整復制到onclick屬性(現在成為了函數)。因此如果這個event handler被執行,this將指向HTML元素,并且該元素的顏色得以改變。
這樣你就可以最大限度使用this。每當執行該函數,this所指向的HTML元素都正確響應事件,這些HTML元素擁有doSomething()的一個拷貝。
Referring
然而,如果你使用inline event registration(內聯事件注冊)

你將不能拷貝該函數!反而這種差異是非常關鍵的。onclick屬性并不包含實際的函數,僅僅是一個函數調用。

因此,它將聲明“轉到doSomething()并且執行它”。當我們到達doSomething(),this關鍵字又重新指向了全局的window對象,函數返回錯誤信息。
如果你想使用this來指向HTML元素響應的事件,你必須確保this關鍵字被寫在onclick屬性里。只有在這種情況下它才指向event handler所注冊的HTML元素。
?


你將得到



正如你所見,this關鍵字被展現在onclick函數中,因此它指向HTML元素。
但是如果執行


你將得到



這僅僅是到doSomething()函數的一個引用。this關鍵字并沒有出現在onclick函數中,因此它不指向HTML元素。