For循环搜索ID的Javascript答案

【问题标题】：For loop Searching ID's JavascriptFor循环搜索ID的Javascript
【发布时间】：2014-11-12 16:53:22
【问题描述】：

好吧，我对这个有点困惑，我会先给你看代码，然后再解释。

    var number = 1;
var maxguess = 6;
/*make the array of possible words*/
var arr = ["horse", "cow", "blueberry", "apples", "time", "hollow", "pumpkin", "telephone", "computer", "calculator", "tower", "castle"];
/*write shuffler code*/
function shuffle(array) {
  var currentIndex = array.length, temporaryValue, randomIndex ;
    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
        // Pick a remaining element...
        randomIndex = Math.floor(Math.random() * currentIndex);
        currentIndex -= 1;
        // And swap it with the current element.
        temporaryValue = array[currentIndex];
        array[currentIndex] = array[randomIndex];
        array[randomIndex] = temporaryValue;
    }
  return array;
}
/*shuffle the array*/
shuffle(arr);
/*make the storage array for user entry*/
var gstore = [];
/*get the first entry in the array, make it a string, and remove any commas*/
var teme = arr.slice(0, 1).toString().replace(/,/g,'');

console.log(teme);

for (var i = 0; i <= 9; i++) {
    if (i > teme.length){
   document.getElementById(i).innerHTML="x";
   }
}

/*listen for button click*/
document.getElementById('sendIt').addEventListener('click', process);
/*function for 'process'*/
function process() {
    /*get the guess from the user*/
    var guess = document.getElementById('guess').value.toString().toLowerCase();
    /*check for any index of this guess*/
        if (gstore.indexOf(guess, 0) == -1){
            /*store this guess*/
            gstore.push(guess);
            /*make storage array for letter indicies*/
            var indices = [];
            /*find indicies of the guess*/
                for(var i=0; i<teme.length;i++) {
                    if (teme[i] === guess) {
                        document.getElementById(i).innerHTML = guess.toString();
                    }
                }
            number++;
        }
    if (gstore.indexOf(guess, 0) != -1){

    }
}

好的，这是我在课堂上制作的刽子手游戏。在 JS 的底部附近你可以看到我写了以下内容-

for(var i=0; i<teme.length;i++) {
                    if (teme[i] === guess) {
                        document.getElementById(i).innerHTML = guess.toString();
                    }
                }

现在，如果我保持原样，这在 JS 控制台中绝对不会出现错误。现在，当我在说

的那一行时出现错误

document.getElementById(i).innerHTML="";

当我把它放在按钮点击功能之外时

console.log(teme);

for (var i = 0; i <= 9; i++) {
    if (i > teme.length){
   document.getElementById(i).innerHTML="";
   }
}

具体来说，错误状态

[Error] TypeError: null is not an object (evaluating 'document.getElementById(i).innerHTML=" "')
    global code (clar.js, line 31)

现在，如果这在这里引发错误，是否值得更改此位置的代码，或者即使第二个实例有效，我是否在两个实例中都做了不好的事情？

非常感谢所有帮助，我的 javascript 老师不知道您可以在编写时输入变量

document.getElementById(variableName)

所以他确实对我没有帮助，而且我发现能够在没有框架的情况下做某事很好

编辑：抱歉，忘记了 HTML，这应该有助于澄清我在做什么

<html>
<head>
</head>
<body>
    <input type="text" name="" value="" id="guess" /><br>
    <input type="button" name="" value="submit" id="sendIt" /><br />
    <script src="./clar.js" type="text/javascript"></script>
    <span id="0"></span><span id="1"></span><span id="2"></span><span id="3"></span><span id="4"></span><span id="5"></span><span id="6"></span><span id="7"></span><span id="8"></span><span id="9"></span>
</body>
</html>

【问题讨论】：

一个页面上不应有多个具有相同 ID 的项目。 ID 是唯一的。我会给项目一个特定的类，然后使用querySelector
该错误表示您正在尝试查找 ID 不存在的元素。不确定您希望我们做什么？
你能给我们你的HTML吗？
我刚刚发布，对此感到抱歉
Why does jQuery or a DOM method such as getElementById not find the element? 的重复——您正试图在元素存在之前访问它们。

标签： javascript loops dom

【解决方案1】：

您的第二个 for 循环正在访问越界的项目，并且索引器正在带回一个空对象。

更改自：

for (var i = 0; i <= teme.length; i++)

到：

for (var i = 0; i < teme.length; i++)

【讨论】：

其实代码后面的用法还可以，第一个是抛出错误的那个
@is-cj：所以，正如你在问题中解释的那样，正好相反？
我添加了我的 html @FelixKling，所以应该更容易理解我现在在做什么，对此感到抱歉

【解决方案2】：

您的错误代码可能来自 JavaScript 未在您的文档中找到 html 元素。

document.getElementById(i).innerHTML = guess.toString();

您确定您的 html 中有 ID 范围从 0 到 teme.length 的元素吗？

如果你也添加你的 html 可能会有所帮助！

【讨论】：

我刚刚发布了我正在使用的html，很抱歉让事情变得更加混乱