javascript innerHTMLとappendChildの混在

めも

動作はするけど、問題はある…ということらしい
メモリの問題をはじめ、いくつか問題があるらしいが…下記のような形の場合、elm_ipt.onclickの設定がなくなる…という問題がある

let container = document.createElement('div');

container.innerHTML = '<input type="hidden" name="csrf" value="aaaaa">'; // ← appendChild()する前だと問題なし

let elm_ipt = document.createElement('input');
elm_ipt.setAttribute('type', 'file');
elm_ipt.setAttribute('name', 'upFile');
elm_ipt.onclick = function(){ /* 処理 */ } // ← コイツが消えるらしい
container.appendChild(elm_ipt);

container.innerHTML += '<input type="button">'; // ← appendChild()した後に追加は良くない