javascript - 在 createTextNode() 中使用变量而不是字符串

Question

我正在尝试通过 Javascript 向 ul 添加另一个 li。我希望 li 根据现有变量具有动态内容。我可以让它使用字符串附加一个 li 没问题。只有当我使用变量时才会出错

//Adding to List
listOfPlayers.style.display = "block";
var node = document.createElement("LI");
var textnode = document.createTextNode(playerInput.value);
node.appendChild(textnode);
listOfPlayersNumerated.appendChild(node);

问题在于：

var textnode = document.createTextNode(playerInput.value);

我尝试了一个文字字符串（如下所示），它没有问题

var textnode = document.createTextNode("New Player");

Answer 1

好吧，我相信它不喜欢这个范围。尽管在控制台中打印出变量。我搬家了

var playerName = playerInput.value;

向上和退出当前功能。奇怪的是 console.log() 会接受它，但不是 .createTextNode() 在那个范围内

因此，通过将新变量在函数外部声明的位置移动，它似乎已经解决了这个问题

Answer 2

所以我改变了它，这样你就可以看到变量来自哪里......

上顶：

var inputPlayer = document.getElementById("inputPlayer");

然后我只需添加 .value 即可获得以下输入的值：

//Adding to List
listOfPlayers.style.display = "block";
var playerName = playerInput.value;
console.log(playerName);
var node = document.createElement("LI");
var textnode = document.createTextNode(playerName);
node.appendChild(textnode);
listOfPlayersNumerated.appendChild(node);

它会将其记录在控制台中，但不会出现在 ul