Javascript 将函数作为对象指向的addEventListener'；属性，而不在加载时启动函数

我正在为一个朋友制作一个基于文本的浏览器内简单RPG。我想从对象生成菜单元素，并向它们添加EventListener，这些元素在单击时激活存储在对象内部的相关函数。我有密码--

var库存=[
{
名称：“第一”，
},
{
姓名：“第二”，
用法：function（）{
警报（“占位符功能”）；
}
},
{
名称：“第三”，
},
];
函数displayInventory（）{
对于（i=0；i

.大分区{
背景色：#ccc；
利润率：10px；
}
.物品用途{
光标：指针；
}

游戏
您可以使用纯js（forEach等）来实现这一点。您不需要为此求助于innerHTML。使用“<代码> CREATE元素< /COD>”（如果您想最小化DOM修改，请考虑使用<代码>新文档片段或<代码> CudioCuMuthEngult< /代码>，这里我没有使用它）：


这是一个基于你想要的更新版本。如果对象具有children属性，则它将使用该数组添加元素（[elementType，text，class]），否则它将使用
name
属性添加文本内容：


您可以使用可运行的堆栈片段来让代码在问题本身中运行。我确实希望在加载页面时加载整个菜单，我只是不希望在单击相应的菜单项之前该项的“使用”函数执行任何操作。哇，这太简洁了。我所需要的是在第二个div中有“clck here to use item”的东西，并且该部分是“item_use”类中唯一的东西。我根据您的需要更新了小提琴和答案。任何时候，您都可以提供一个子键，它是一个数组数组，数组的元素类型为第一个，文本为第二个，类名为第三个索引，它将填充父div。谢谢！这将需要一些时间来反向工程，并适用于我所有的菜单，但至少我会学到一些东西的过程中。当然，如果有什么不清楚，让我知道。祝你的项目好运。
var inventory = [
    {
        name: "first",
    },
    {
        name: "second",
        use: function(){
            alert   ("placeholder function");
        }
    },
    {
        name: "third",
    },
];

var container = document.getElementById("div_name");
inventory.forEach(function(d,i){
   var div = document.createElement("div");
   div.textContent = d.name && d.name || "placeholder";
   div.className = "item_use";
   div.id = "additional_div_use"+i;
   d.use && div.addEventListener("click",d.use,false);
   this.appendChild(div);
},container);

var inventory = [
    {
        name: "first",
    },
    {
        name: "second",
        use: function(){
            alert   ("placeholder function");
        },
        children:[["div","click here to use item","item_use"]]
    },
    {
        name: "third",
    },
];

var container = document.getElementById("div_name");
inventory.forEach(function(d,i){
   var div = document.createElement("div");
   !d.children && (div.textContent = d.name && d.name || "placeholder");
   div.id = "additional_div_use"+i;
   d.use && div.addEventListener("click",d.use,false);
   d.children && d.children.forEach(function(dd,ii){
       var el = document.createElement(dd[0]);
       el.textContent = dd[1] || "";
       el.className = dd[2] || "";
       this.appendChild(el);
   },div);
   this.appendChild(div);
},container);