JS问题：遍历document.querySelector不适用于追加子项

Question

我在遍历document.querySelectorAll时遇到问题，它始终对我有效，但现在不起作用。 当我为document.querySelectorAll或为document.querySelectorAll。做时，它会迭代的长度，甚至console.log会发送正确的值，但文档。追加对我没有任何想法吗？ 例： 我有2个具有相同ID的输入，然后下面的代码使用它，并将COUNTRY_LIST_EN 2次附加到第一个选择器中，但控制台日志返回第一个和第二个。

我已经尝试过对[... document.querySelectorAll]进行迭代，但是它也不起作用

const COUNTRY_LIST_EN = `Afrikaans,Albanian,Amharic,Arabic,Armenian,Azerbaijani`.split(",");
const languageSelectors = document.querySelectorAll("#language");
const languageFragment = document.createDocumentFragment();
for (let country of COUNTRY_LIST_EN) {
    languageFragment.appendChild(new Option(country));
}
for (languageSelector of [...languageSelectors]) {
    console.log(languageSelector) //logs first #language input and second
    languageSelector.appendChild(languageFragment); //apends to only one item
}

预期结果是将列表都添加到这两者，而不是将其两次应用于第一次输入