javascript - jQuery 如何用同一个元素替换多个元素？

Question

我正在尝试在浏览器中制作 Hangman 游戏。我生成一个随机单词，然后为单词的每个字母显示一个空框，用户将能够单击带有字母的按钮来尝试猜测随机单词是否包含该字母。如果是，则代表该字母的所有空框都将替换为一个写有该字母的框。

我的问题是，如果生成的单词包含多次单击的字母，最后只会替换最后一次出现的字母，我认为这是由于我错误地使用了 jQuery 的“replaceWith”造成的。我希望我没有让这听起来太复杂，如果您有任何问题，请尽管提问!

这是我的代码:

// Get all occurences of the clicked letter and push their positions into array

  function letterClicked(id) {
    var positionsOfLetter = [];
    for (var i = 0; i < randomWord.length; i++) {
      if (randomWord[i] == id) {
        positionsOfLetter.push(i);
      }
    }
    // Replace each box at position that contains the letter clicked with a box containing the letter clicked

    positionsOfLetter.forEach(position => {
      $('#' + position).replaceWith($("#" + id));
    });
  }

Answer 1

这一行

$('#' + position).replaceWith($("#"+ id));

每次都返回相同的元素，导致它四处移动，直到它在循环的最后一次迭代中稳定下来。替换为

$('#' + position).replaceWith($("#"+ id).clone());

应该可以解决问题。