目前这并不是一个真正的问题,只是我正在寻找另一个解决方案。 当然,我必须有一种更聪明的方法来给每个学生写一个 if 问题,就像我在这里所做的那样来获取他们的成绩。
如果我想通过 for 循环获得相同的结果?我该如何继续这样做呢?有什么明智的建议吗?
var nameandgrades = {
"students": [{
"namn": "Klara",
"grade": "A"
},
{
"namn": "Andrea",
"grade": "B"
},
{
"namn": "Emil",
"grade": "C"
}
]
};
var klara = "Klara";
var andrea = "Andrea";
var emil = "Emil";
function getGrade() {
var studentname = document.getElementById("studentname").value;
if (studentname == klara) {
document.getElementById("output").innerHTML = nameandgrades.students[0].grade + ' ';
}
if (studentname == andrea) {
document.getElementById("output").innerHTML = nameandgrades.students[1].grade + ' ';
}
if (studentname == emil) {
document.getElementById("output").innerHTML = nameandgrades.students[1].grade + ' ';
}
}
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="utf-8">
<title>json javascript</title>
</head>
<body>
<h1> Write the students name and see what grade he/she has! </h1>
<form>
<!-- textbox -->
<input type="text" id="studentname" value="Klara" placeholder="name of the student" />
<br />
<br>
<!-- mouseclick -->
<input type="button" value="visa" onclick="getGrade();" />
<br />
<br>
</form>
<div id="output"> </div>
</body>
</html>
非常感谢任何帮助!
干杯! //macgajver
最佳答案
您希望从姓名与输入中给出的姓名匹配的学生数组中获取该对象。
- 将输入的值存储在变量中。
- 对
nameandgrades.students
使用find()
并检查对象name
属性是否与哪个输入值匹配。 - 获得该对象后,获取其等级并输出。
其他一些提示是:
- 在全局范围内声明 html 元素,这样您就不会在每次单击按钮时都获取它们。
- 使用
const
来声明对象和 html 元素。 - 在访问
grade
之前检查是否找到对象,否则会导致错误。
const input = document.getElementById("studentname");
const output = document.getElementById("output")
const nameandgrades = { "students": [{ "name": "Klara", "grade": "A" }, { "name": "Andrea", "grade": "B" }, { "name": "Emil", "grade": "C" } ] };
function showGrade() {
let name = input.value
let object = nameandgrades.students.find(x => x.name === name);
let grade;
if(object){
grade = object.grade
}
output.innerHTML = grade || "Sorry student not found"
}
<h1> Write the students name and see what grade he/she has! </h1>
<form>
<!-- textbox -->
<input type="text" id="studentname" value="Klara" placeholder="name of the student" />
<br />
<br>
<!-- mouseclick -->
<input type="button" value="visa" onclick="showGrade();" />
<br />
<br>
</form>
<div id="output"> </div>
关于javascript - 如何将 if 语句转换为 for 循环,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65307523/