Javascript HtmleElement focus（）方法未捕获类型错误

我遇到了一个问题，虽然我还在学习javascript，但我觉得这个问题很奇怪。我只想在设置状态值时进行一些计算，如果未设置状态，则希望表单字段处于焦点

现在的问题是下面的代码不起作用

document.getElementById('cart-hplus').addEventListener('submit', estimateTotal);

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state').value;
    if (state === '') {
        alert("Please choose your preferred shipping state.");

        state.focus();
    }
}

未捕获类型错误：state.focus不是函数

但这是可行的，但我认为声明一个变量然后在if语句中再次使用document对象不是一个好习惯

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state').value;
    if (state === '') {
        alert("Please choose your preferred shipping state.");

        document.getElementById('s-state').focus();
    }
}

---

第一个代码有什么问题？

您没有区分状态输入控件和状态值。您需要使用两个变量：

function estimateTotal(event) {
    event.preventDefault();
    var state = document.getElementById('s-state');
    var stateValue = state.value;
    if (stateValue === '') {
        alert("Please choose your preferred shipping state.");
        state.focus();
    }
}

---

而且，你的方式很好。两次引用对象没有错。

在第一个代码中进行以下更改

document.getElementById('cart-hplus').addEventListener('submit', estimateTotal);

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state');
    if (state.value === '') {
        alert("Please choose your preferred shipping state.");

        state.focus();
    }
}

---

状态

是元素上获得的

值

时的字符串。删除

.value

并在

if

条件中使用

state.value

。将元素引用存储在变量

var state=document.getElementById（'s-state'）中

然后使用

state.value

和

state.focus（）

谢谢大家，我知道错误的来源了。我现在更明白了@Satpal很好的解释。感谢这一课，我已经对我的代码进行了修改，它现在可以工作了。太棒了！很高兴听到。