Javascript 无法从函数参数中找到数组

Question

我希望 JavaScript 根据您单击的项目查找项目信息，而不是为每个项目创建一个新函数。

我试图通过将 id 作为参数传递给 JavaScript 函数来做到这一点，但是找不到 variable/array.

当您运行代码在控制台中输出尖峰时，但在尝试查找 array.z

时它不起作用

我也尝试过使用 value 代替 id，但效果是一样的。

var withspike = document.getElementById('withspike');
var withid = document.getElementById('withid');
var spikes = {name:"Spikes", description:"Do not eat me.", damage:"500" };

function itemClicked(id) {
 console.log(id);
 document.getElementById('withspike').innerHTML = spikes["description"];
    document.getElementById('withid').innerHTML = id["description"];
}

<style>
  #spikes {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    background-color: #FF0000;
}
</style>

<div id="withspike"></div>
<div id="withid"></div>
<div onclick="itemClicked(id)" id="spikes"></div>

Answer 1

你应该使用它来传递元素本身，并遍历到你想要的 dom 元素。

例如：

<div id="withspike"></div>
<div id="withid"></div>
<div onclick="itemClicked(this)" id="spikes"></div>

你可以使用这个功能：

function itemClicked(el) {
       var id = el.previousSibling.innerHTML; // Get previous sibling
       console.log(id);       
}

谢谢！

编辑。抱歉，我使用了 id，而我打算使用 this!

Answer 2

您可以将尖刺（以及未来的其他元素）放入包含对象中，并使用 id 从那里获取它：

var elements = {
   spikes:{name:"Spikes", description:"Do not eat me.", damage:"500" }
};

通话

elements[id]["description"];

Fiddle

还有一个包含多个元素的额外示例（并在函数调用中使用 this 与 id）：

Fiddle2

Answer 3

避免混淆 HTML 和 JavaScript 可能是明智的。你可以这样做：

<div id="spikes"></div>

<script>
  var spikes = document.getElementById("spikes");
  spikes.addEventListener("click", function () {
    itemClicked(spikes);
  });
</script>

Javascript 无法从函数参数中找到数组

Javascript can't find array from function argument

html

javascript

arrays

arguments