javascript - JavaScript を使用して既存の関数で onclick リスナーを追加する

Question

私は既存のJavaScript関数を持っています:

function changeColor(ID){

    try{
        initialize();
    }
    finally{
        changeDesign(ID);
    }

}

私はこのようなことをしたい:

for(var x=0; x<2; x++){
        document.getElementById(x).onclick = "changeColor(" + x +")";
}

html の出力は次のようになります。

<tr bgcolor="#FFFFFF" id="0" onclick="changeColor(0)>

Answer 1

DOM API を介してイベント ハンドラーを割り当てても、実際の HTML は変更されません(実際、ブラウザーが受け取る HTML ソースは読み取り専用です)。

文字列ではなく、関数をに割り当てる必要があります。.onclick

for(var x=0; x<2; x++){
    document.getElementById(x).onclick = changeColor;
}

は次のようにchangeColor定義されます

function changeColor(){
    var ID = this.id; // `this` refers to element the handler is bound to

    try{
        initialize();
    }
    finally{
        changeDesign(ID);
    }

}

quirksmode.org のイベント処理に関する優れた記事を読むことをお勧めします。