結合兩個不同的 JavaScript 函數來獲取 JSON 兄弟數據

Question

我有兩個功能。 一個-在“點擊”上獲得 id 值。 第二 - 從一個 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"));
  });
}

Answer 1

您可以將邏輯直接放入匿名函數中並使用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);
  });   
}