Javascript：单击注入按钮？

Question

我的问题似乎很奇怪，但我希望我的javascript代码单击我以前在页面中注入的具有相同脚本的按钮。 我尝试过这样的事情：

var injectionarea = document.getElementById('whereIwant');
injectionarea.innerHTML += "<button id=\"my_button\">Test</button>";

document.getElementById('my_button').onclick = function() {
                                                            //my stuff
                                                          };

my_button.click();

但是它返回一个未定义的元素...

Answer 1

您尝试执行的操作中存在一些问题。 通常，将dom控件作为字符串注入会带来一些奇怪的情况（例如，容器元素中的任何子节点都可能恢复为原始页面状态）。 因此最好通过document.createElement函数创建对象。

无论如何，在您的情况下，您只需要“等待” dom读取您的注射剂，解析它并创建元素（如上所述，您应该自己做的事情）。

因此，添加setTimeout就像下面的示例一样，即使它不是我希望看到的最干净的代码，也可以使它工作：

var injectionarea = document.getElementById('whereIwant');
injectionarea.innerHTML += "<button id=\"my_button\">Test</button>";

setTimeout(function(){
   document.getElementById('my_button').onclick = function() {
                                                            //my stuff
                                                          };

   my_button.click();
},0);

永远记住，JS是单线程的，因此您需要由DOM解析的任何编辑都不会在DOM本身中可用，直到您释放工作线程。

Answer 2

尝试这个：

function a(){
    var injectionarea = document.getElementById('whereIwant');
    injectionarea.innerHTML += "<button id=\"my_button\" onclick=\"doClick()\">Test</button>";
}
function doClick(){
//my stuff
}