為什么“ this”關鍵字在這里不起作用？

Question

<button onclick="test()">Will it work?</button>


function test() {
this.innerHTML = "It works!";
}

該按鈕將調用功能測試，因此它應該受到“ this”關鍵字的影響。

Answer 1

傳遞給函數

<button onclick="test(this)">

function test(btn) {
    console.log(btn);
    btn.innerHTML = "it worked";
}

http://jsfiddle.net/KV27W/1/

Answer 2

從MDN文檔中 ：

在函數內部，此值取決於函數的調用方式。

簡單的電話

 function f1(){ return this; } f1() === window; // global object 

在這種情況下，值this不被調用設置。 由於代碼是不是在嚴格模式下，價值this必須是一個對象，它默認為全局對象。

因此，每當您將函數調用為func() ， this指向全局對象。 這就是您在這里所做的：

onclick="test()"

你是正確的， this事件里面處理程序參照處理程序綁定到元素，但test不是事件處理程序，它是在事件處理程序的身體 。 從屬性值生成的處理程序看起來像

function(event) {
    test();
}

所以你看，這是一個“簡單的調用”，所以沒有什么問題， this指的是。

---

如果你想擁有它指的是按鈕，然后就可以用.call ，撥打test ，並明確設置this來傳遞的值：

onclick="test.call(this)"