我有一段简单的代码。当我按下按钮时，我想更改该按钮的颜色。当我按下这个按钮时，我得到的当前错误是“无法读取未定义的属性‘changeColor’”。我不明白我哪里出错了。我编写这段代码的目的是不过度污染全局命名空间，因为我打算添加更多代码。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<style>
#wrap{
margin-top: 30px;
margin-left: 30px;
}
.btn{
font-size: 20px;
width: 65px;
height: 45px;
}
</style>
</head>
<body>
<div id="wrap">
<button id="btn1" onclick="pub.changeColor('#66FFFF')" class="btn">btn1</button>
<button id="btn2" class="btn">btn2</button>
</div>
我的 JS 文件:
var pub = (function(){
var changeColor = function(element, color){
element.style.backgroundColor = color;
}
})();
最佳答案
因为你没有返回任何东西，所以 pub 的值是未定义的。更好:
var pub = (function(){
return {
changeColor: function(element, color) {
element.style.backgroundColor = color;
}
};
})();
您现在可以使用在 IIFE 内部声明的局部变量，这些变量对于 IIFE 本身的代码是私有(private)的。您返回的对象的属性最终对您的 pub 模块的用户可见。
关于javascript - 为什么我的命名空间未定义？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32553848/