動的に追加したオブジェクトに複数のonload属性を付与する

Question

###前提・実現したいこと
動的に追加したオブジェクトに複数のonload属性を付与する

###発生している問題・エラーメッセージ
以下のソースで実行したところ、ページがフリーズしてしまう

###該当のソースコード

var element = document.createElement('img'); 
	                 element.src = "img/stand.png"; 
	                 element.id = num; 
                 element.style.position="absolute";
                       element.width=60;
                       element.height=60;
	                 element.style.left =120; 
                       element.style.top =30; 
            num++;
            element.onload = new Function("move(this);");//ここと直後の関数を付与したい
            element.onload = new Function("sound(this);");
            element.onclick = new Function("remove(this)");
 
	    var objBody = document.getElementsByTagName("body").item(0);
	    objBody.appendChild(element); 

###試したこと
element.onload = new Function("move(this);"),new Function("sound(this);");
としたものの、フリーズはしなかったが動作が正常でなかった

Answer 1

複数のリスナーを割り当てる場合はaddEventListenerを使用してください。

element.addEventListener('load', move);
element.addEventListener('load', sound);

あと、

document.getElementsByTagName("body").item(0);

でbody要素を取得し、bodyに要素を追加していますが、document.bodyで取得することができます。

document.body.appendChild(element);

Comments

[think49]

大筋は同意ですが、少しだけ捕捉します。
addEventListener の第三引数省略は DOM4 から規定された比較的新しい仕様なので、後方互換性の為に false を指定する事をお勧めします。
また、質問文のコードでは move, sound が第一引数で this を渡すように作られているようなので、event オブジェクトが渡されて動くように move, sound のコードを修正する必要があると思われます。
https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener

[mimikku]

ご回答ありがとうございます。
引数なんですが、
element.addEventListener('load', "move(this)", false);
element.addEventListener('load', "sound(this)", false);
としたところ正しい結果が得られませんでした。
正しい書きかたを教えていただければ幸いです