首页 > 解决方案 > 结合两个不同的 JavaScript 函数来获取 JSON 兄弟数据

问题描述

我有两个功能。一个 - 在“点击”上获取 id 值。second- 从 id 获取兄弟数据。

我想组合这两个函数,所以当我单击一个 div 时,获取那个 'id' 并显示来自 JSON 的兄弟数据

//this returns sibling data from JSON with id=2
const result = characters.find(item => {
  // if this returns `true` then the currently 
  // iterated item is the one found
  return item.id === 2 
});

console.log(result);

//this allows me to click the different divs to get their id
var divs = document.querySelectorAll(".characterBox");

for(var i = 0; i < divs.length; i++) {
  divs[i].addEventListener('click', function (event) {
    console.log(this.getAttribute("id"));
  });
}

标签: javascript

解决方案


您可以将逻辑直接放入匿名函数并this.getAttribute("id")使用2

var divs = document.querySelectorAll(".characterBox");

for (var i = 0; i < divs.length; i++) {
  divs[i].addEventListener('click', function(event) {
    const result = characters.find(item => {
      return item.id == this.getAttribute("id")
    });
    console.log(result);
  });   
}

推荐阅读