innerHTMLをパラメータで変更する

Question

段落を上に移動して変更しようとしました。

HTML

<p id="foo"> Hello world! </p> 

Javascriptを

var foo = document.getElementById("foo"); 
foo.addEventListener("mouseover", ChangeText("Goodbye world!")); 

function ChangeText(s) { 
    this.innerHTML = s; 
} 

しかし、段落がホバーに変更されません。パラメータが省略され、文字列が以下のように直接入力されると、動作します。どうして？

var foo = document.getElementById("foo"); 
foo.addEventListener("mouseover", ChangeText); 

function ChangeText() { 
    this.innerHTML = "Goodbye world!"; 
} 

Answer 1

addEventListenerは関数を2番目の引数として指定します。したがって、引数を指定して関数を呼び出すと、次のように書くことができます。

foo.addEventListener("mouseover", function(event){ 
     ChangeText("Goodbye world!",event.target) 
    }); 

function ChangeText(s,target) { 
    target.innerHTML = s; 
}