Javascript 调用自调用函数中定义的函数

我有一个自调用函数来保存我所有的javascript代码。 （就像书中建议的那样）

在这个函数里面，我创建了一个按钮，这个按钮 onclick=“myfunction（）”属性集。像这样：

(function() {
    var x = 4;
    var btn = document.createElement('button');
    btn.type = "button";
    btn.style.width = "100";
    btn.textContent = "click me";
    btn.id = "bid";
    btn.setAttribute('onclick', "myfunction()");
    document.body.appendChild(btn);

    function myfunction() {
       alert(x);
    } 

})();

(function() {
    var x = 4;
    var btn = document.createElement('button');
    btn.type = "button";
    btn.style.width = "100";
    btn.textContent = "click me";
    btn.id = "bid";
    btn.setAttribute('onclick', "myfunction()");
    document.body.appendChild(btn);

})();

function myfunction() {
    alert(x);
}

但当我单击created按钮时，找不到myfunction（）。信息是：

ReferenceError:找不到变量：myfunction

然后我将myfunction（）移出，如下所示：

(function() {
    var x = 4;
    var btn = document.createElement('button');
    btn.type = "button";
    btn.style.width = "100";
    btn.textContent = "click me";
    btn.id = "bid";
    btn.setAttribute('onclick', "myfunction()");
    document.body.appendChild(btn);

    function myfunction() {
       alert(x);
    } 

})();

(function() {
    var x = 4;
    var btn = document.createElement('button');
    btn.type = "button";
    btn.style.width = "100";
    btn.textContent = "click me";
    btn.id = "bid";
    btn.setAttribute('onclick', "myfunction()");
    document.body.appendChild(btn);

})();

function myfunction() {
    alert(x);
}

现在它可以找到myfunction（），但发出警报的x值类似于 [object HTMLSelectElement]，不是我所期望的

---

我对自调用函数中的函数有些困惑。

不要将函数作为字符串传递，因为它是在找不到函数的上下文中求值的，只需这样做即可

btn.addEventListener('click', myfunction);

---

如果我理解你的问题，如果你想使用另一个onload函数，或者使用foo作为onload函数

     function foo(){ 
        some code here for foo function
        bar();
     }


     function bar() {
        some code here for bar function
     }

---

导出函数，以便可以从HTML调用它

(function() {
    var x = 4;
    var btn = document.createElement('button');
    btn.type = "button";
    btn.style.width = "100";
    btn.textContent = "click me";
    btn.id = "bid";
    btn.addEventListener('click', myfunction);
    document.body.appendChild(btn);

    function myfunction() {
       alert(x);
    } 

    window.myfunction = myfunction;
})();

---

或

btn.onclick=myfunction。“x”的作用域也有问题。@FelixKling是的，这是我的第一个版本，我想知道是否还有理由提及它会带来的兼容性问题solve@Mwr247如果函数在与x相同的作用域中声明，则作用域没有问题，IIFE将关闭这两个作用域。@dystroy:不知道：）（意思是我对此没有强烈的意见）“我对自调用函数中的函数有点困惑。”它们没有什么特别之处。它们与其他地方定义的函数没有区别。实际问题是HTML事件属性是在全局范围内计算的。为什么要更改
btn.setAttribute（'onclick'，“myfunction（）”）；
？大脑衰退。我本想把它改成addEventListener，但忘了。谢谢你指出。
“myfunction”
->
myfunction
。