您可以将字母列表Map到单个元素中，这将允许事件侦听器 target 返回个人信件。

window.addEventListener('load', () => {
  let letters = document.querySelector('.letters');
  letters.innerHTML = letters.innerText.split('').map(l => `<span>${l}</span>`).join('');
  document.querySelector('.letters').addEventListener('click', e => {
    console.log(e.target.innerText);
  })
})

p {
  font-size: 3rem;
}

<p class='letters'>ABCDEFGHIJKLMNOPQRSTUVWXYZ</p>

元素中有一个字符串，该元素是可单击的，并且可以在其上有一个事件。但是，要确定要单击的确切字符，需要将该字符 Package 在可以识别为其自身选择器的元素中。
一种方法是获取元素（字符）的textcontent，拆分字符串，创建每个字符的数组。然后迭代该数组并创建一个 span 标记，为单击事件添加一个类，并将每个字符值放入每个 span 标签。然后将每个标记追加回元素中。
然后，您可以创建一个eventlistener，用于侦听对添加的类的单击。

function getChar(e) {
  console.log(e.target.textContent)
}

function createClickables() {
  const str = document.querySelector('.info')
  const parts = str.textContent.split('')
  str.textContent = ''
  parts.forEach(char => {
    let span = document.createElement('SPAN')
    span.textContent = char
    span.classList.add('char')
    str.append(span)
  })
}

createClickables()

const chars = document.querySelectorAll('.char')
chars.forEach(item => {
  item.addEventListener('click', getChar)
})

p {
  font-size: 3rem;
}

.char {
  cursor: pointer;
}

<p class="info">ABCDEFGHIJKLMNOPQRSTUVWXYZ</p>