Javascript 从html输入中获取值

我试图从一个html输入中获取值，但我很难让它正常工作，从我自己的研究来看，看起来我有正确的语法？所以我很困惑

当我将该值记录在控制台日志中时，它看起来并没有实际获取输入的值

let btn = document.getElementById("btn");
let grade = document.getElementById("gradeNum").value;

function getGrade() {
    console.log(grade);

    if (grade >= 90) {
        document.getElementById("gradeLetter").innerHTML = "You got an A!";
    } else if (grade < 90 && grade >= 80) {
        document.getElementById("gradeLetter").innerHTML = "You got a B!";
    } else if (grade < 80 && grade >= 70) {
        document.getElementById("gradeLetter").innerHTML = "You got a C!";
    } else if (grade < 70) {
        document.getElementById("gradeLetter").innerHTML = "You got an F! Study more!";
    }
};

让btn=document.getElementById（“btn”）；
让grade=document.getElementById（“gradeNum”）.value；
函数getGrade（）{
控制台日志（等级）；
如果（等级>=90）{
document.getElementById（“gradeLetter”）.innerHTML=“你得了A！”；
}否则，如果（等级<90&&grade>=80）{
document.getElementById（“gradeLetter”）.innerHTML=“你得了B！”；
}否则，如果（等级<80&&grade>=70）{
document.getElementById（“gradeLetter”）.innerHTML=“你得了C！”；
}否则，如果（等级<70）{
document.getElementById（“gradeLetter”）.innerHTML=“你得了F！学习更多！”；
}
};

有几件事：

（1） 如果您使用的是typescript，则（返回的内容）没有

值

属性。
为此，您需要将其转换为：

（2） 此输入元素的

值

的类型是字符串，因此

等级

也是字符串，但您将其视为数字。
虽然

“5”==5

为true，但

“5”==5

为false，因此您可能需要获取数值：

let grade = parseInt((document.getElementById("gradeNum") as HTMLInputElement).value);

（3） 您将

grade

的值设置为一个全局变量，但以后似乎不会重新分配它。
也就是说，当页面加载时，您将为其分配一个空字符串（因为用户没有在输入框中输入值），然后当调用

getGrade

函数时，您不会检查当前值

应该是：

let grade: number;

function getGrade() {
    grade = parseInt((document.getElementById("gradeNum") as HTMLInputElement).value);

    console.log(grade);
    ...
}

试试这个：

让btn=document.getElementById（“btn”）；
//让grade=document.getElementById（“gradeNum”）.value；=90) {
...

问题在于：

grade = document.getElementById("gradeNum").value;

这在第二行，在用户键入输入之前对其进行整体评估

而是像这样做：

grade = document.getElementById("gradeNum");

然后参照如下等级：

if (grade.value >= 90)

---

它被输入为一个数字，并根据数字，吐出一个等级字母。我有输入类型作为一个数字。但是谢谢你，HTMLInputElement是有用的。我以前不想使用它。我知道输入是用于数字的，但不管怎样，当你得到一个html输入元素的值时，你会得到它作为一个字符串需要使用

parseInt（val）

、

parseFloat（val）

或

number（val）

将其转换为一个数字，这样应该可以工作。“因为”在用户输入任何输入之前，页面加载时，上面放置的“.value”将被计算为空字符串。语法正常。请检查代码中的拼写gradeNum。您好，您是否尝试在函数内getGrade（）内获取grade值？成功了。但这对我来说很奇怪，它不是双向工作吗？@karmadreamwalker没有。你需要在

控制台之前再次读取输入值。日志
等级
不会自动更新
if (grade.value >= 90)