Javascript 未捕获类型错误DOM元素controlLabels[i]未定义

Javascript 未捕获类型错误DOM元素controlLabels[i]未定义,javascript,dom,Javascript,Dom,以下代码显示此错误:未捕获的TypeError:controlLabels[i]在用于表单的感谢页面上未定义。表单及其所有元素在此页面上不存在。引用此函数的函数不会在“谢谢”页面上产生任何错误。我已将该函数包括在下面 更新:使查询选择器更具体,并将controlLabels长度分配给count变量,从而解决了问题。 function questionMarkers() { const controlLabels = document.querySelectorAll('div[cla

以下代码显示此错误:未捕获的TypeError:controlLabels[i]在用于表单的感谢页面上未定义。表单及其所有元素在此页面上不存在。引用此函数的函数不会在“谢谢”页面上产生任何错误。我已将该函数包括在下面

更新:使查询选择器更具体,并将controlLabels长度分配给count变量,从而解决了问题。

function questionMarkers() {  
    const controlLabels = document.querySelectorAll('div[class*="rsform-block-question"] .formControlLabel');
    let count = controlLabels.length;
    for (let i = 0; i < count; i++) {
        let marker = `<span class="question-marker">${i+1}</span>`;
        controlLabels[i].insertAdjacentHTML('beforebegin', marker);
    }
}

function runQuiz() {
    questionMarkers();

    let correctAnswers = 0;
    let totalQuestions = 8;

    const answers = document.querySelectorAll(".rsform-radio");
    answers.forEach(function (answer) {
        answer.addEventListener("click", function (event) {
            let target = event.target;
            let formContainer = target.closest(".formContainer");
            let trueElement = formContainer.querySelector("div[class$='true']");
            let falseElement = formContainer.querySelector("div[class$='false']");
            let feedbackElement = formContainer.querySelector("div[class$='feedback']");
            let questionBlock = formContainer.querySelector('div[class*="rsform-block-question"]');
             let nextButtons = formContainer.querySelector(".js-btn--next.success");
             let submitButton = formContainer.querySelector(".js-btn--submit.rsform-submit-button");

             if (event.target.value == "t") {
                 trueElement.style.display = "block";
                 falseElement.style.display = "none";
                 feedbackElement.style.display = "block";
                 correctAnswers++;
                 console.log(correctAnswers);
                 if(nextButtons !== null && nextButtons !== '') {
                     nextButtons.style.display = "block";
                 }
                 if(submitButton !== null && submitButton !== '') {
                     submitButton.style.display = "block";
                 }
             } else {
                trueElement.style.display = "none";
                falseElement.style.display = "block";
                feedbackElement.style.display = "block";
                if(nextButtons !== null && nextButtons !== '') {
                    nextButtons.style.display = "block";
                }
                if(submitButton !== null && submitButton !== '') {
                    submitButton.style.display = "block";
                }
            }

            questionBlock.style.display = "none";
        });
    });
}
runQuiz();
包含insertAdjacentHTML的HTML表单块供参考:

<div class="row rsform-block rsform-block-question-one">
    <div class="medium-3 columns">
        <span class="question-marker">1</span>
        <label class="formControlLabel" data-tooltip="" aria-haspopup="true" data-disable-hover="false" tabindex="1" title="">
            What sense do owls use the most?
        </label>
    </div>
    <div class="medium-9 columns formControls">
        <input type="radio" name="form[question-one]" value="f" id="question-one0" class="rsform-radio">
        <label for="question-one0">Sight</label>
        <br>
        <input type="radio" name="form[question-one]" value="f" id="question-one1" class="rsform-radio">
        <label for="question-one1">Smell</label>
        <br>
        <input type="radio" name="form[question-one]" value="t" id="question-one2" class="rsform-radio">
        <label for="question-one2">Hearing</label>
        <br>
        <input type="radio" name="form[question-one]" value="f" id="question-one3" class="rsform-radio">
        <label for="question-one3">Taste</label>
    </div>
</div>

1.
猫头鹰最常用什么感觉?
景象

气味
听力
品味

我不确定为什么
问号
函数有问题。

如果
元素少于8个
元素,就会出现该错误。为什么不使用
let count=controlLabels.length
<div class="row rsform-block rsform-block-question-one">
    <div class="medium-3 columns">
        <span class="question-marker">1</span>
        <label class="formControlLabel" data-tooltip="" aria-haspopup="true" data-disable-hover="false" tabindex="1" title="">
            What sense do owls use the most?
        </label>
    </div>
    <div class="medium-9 columns formControls">
        <input type="radio" name="form[question-one]" value="f" id="question-one0" class="rsform-radio">
        <label for="question-one0">Sight</label>
        <br>
        <input type="radio" name="form[question-one]" value="f" id="question-one1" class="rsform-radio">
        <label for="question-one1">Smell</label>
        <br>
        <input type="radio" name="form[question-one]" value="t" id="question-one2" class="rsform-radio">
        <label for="question-one2">Hearing</label>
        <br>
        <input type="radio" name="form[question-one]" value="f" id="question-one3" class="rsform-radio">
        <label for="question-one3">Taste</label>
    </div>
</div>