Javascript 如何在html div标记上显示person对象的属性？

职能人员（姓名、年龄、出生日期、性别、身份证）{
this.name=名称；
这个。年龄=年龄；
this.dob=新日期（dob）；
这个。性别=性别；
this.id=id；
}
//声明变量。
let person1=新人（'John Doe'，19'，19-02-2001'，'male'，'001'）；
let person2=新人（'Jane Doe'，19'，22-02-2001'，'Femal'，'002'）；
让输入=document.getElementById（'text'）；
let show=document.getElementById（'result'）；
let button=document.getElementById（'button'）；
//创建函数以运行代码
button.onclick=函数（）{
如果（输入===person1.id）{
show.innerHTML=`Name:${person1.Name}
Age:${person1.Age}
DOB:${person1.DOB}
Gender:${person1.Gender}`；
}else if（输入===person2.id）{
show.innerHTML=`Name:${person2.Name}
Age:${person2.Age}
DOB:${person2.DOB}
Gender:${person2.Gender}`；
}否则{
show.innerHTML='软件崩溃！'；
console.log（输入值）；
console.log（person1.id）；
}
}

正文{
填充：0px；
保证金：0；
}
#清楚的{
填充顶部：50px；
}
#输入{
填充：10px；
保证金：自动；
边框：2件纯黑；
宽度：60%；
}
#正文{
填充物：5px；
宽度：70%；
}
#钮扣{
填充：7px；
边界：无；
颜色：白色；
背景：黑色；
}
#结果{
背景#f1f1；
填充：12px；
宽度：60%；
保证金：自动；
字体大小：22px；
}

提交

您需要用对象检查输入值（而不是输入本身）。 因此，将您的button.onclick功能更改为以下选项将解决您的问题：

button.onclick = function() {
  if (input.value === person1.id) {
    show.innerHTML = `Name : ${person1.name} <br> Age : ${person1.age} <br> DOB : ${person1.dob} <br> Gender : ${person1.gender}`;
  } else if (input.value === person2.id) {
    show.innerHTML = `Name : ${person2.name} <br> Age : ${person2.age} <br> DOB : ${person2.dob} <br> Gender : ${person2.gender}`;
  } else {
    show.innerHTML = 'Software Crashed!';
    console.log(input.value);
    console.log(person1.id);
  }
}

button.onclick=function（）{
if（input.value==person1.id）{
show.innerHTML=`Name:${person1.Name}
Age:${person1.Age}
DOB:${person1.DOB}
Gender:${person1.Gender}`；
}else if（input.value==person2.id）{
show.innerHTML=`Name:${person2.Name}
Age:${person2.Age}
DOB:${person2.DOB}
Gender:${person2.Gender}`；
}否则{
show.innerHTML='软件崩溃！'；
console.log（输入值）；
console.log（person1.id）；
}
}

在行中，

如果（input==person1.id）{..}

您试图将输入元素与id进行比较，而不是与input的值进行比较。因此

改变

input === person1.id

到

职能人员（姓名、年龄、出生日期、性别、身份证）{
this.name=名称；
这个。年龄=年龄；
this.dob=新日期（dob）；
这个。性别=性别；
this.id=id；
}
//声明变量。
let person1=新人（'John Doe'，19'，2001-02-19'，'male'，'001'）；
let person2=新人（'Jane Doe'，19'，2001-02-22'，'Femal'，'002'）；
让输入=document.getElementById（'text'）；
let show=document.getElementById（'result'）；
let button=document.getElementById（'button'）；
//创建函数以运行代码
button.onclick=函数（）{
if（input.value==person1.id）{
show.innerHTML=`Name:${person1.Name}
Age:${person1.Age}
DOB:${person1.DOB}
Gender:${person1.Gender}`；
}else if（输入===person2.id）{
show.innerHTML=`Name:${person2.Name}
Age:${person2.Age}
DOB:${person2.DOB}
Gender:${person2.Gender}`；
}否则{
show.innerHTML='软件崩溃！'；
console.log（输入值）；
console.log（person1.id）；
}
}

正文{
填充：0px；
保证金：0；
}
#清楚的{
填充顶部：50px；
}
#输入{
填充：10px；
保证金：自动；
边框：2件纯黑；
宽度：60%；
}
#正文{
填充物：5px；
宽度：70%；
}
#钮扣{
填充：7px；
边界：无；
颜色：白色；
背景：黑色；
}
#结果{
背景#f1f1；
填充：12px；
宽度：60%；
保证金：自动；
字体大小：22px；
}

提交

你是说像这样吗？？对它的工作！您更改了什么？我已将if语句中的

input

更改为

input.value

。。如果这是有效的，我应该把它作为答案发布吗？？你能核实一下吗？是的，它在工作。谢谢但dob显示无效。也有解决办法吗？我会检查并发布。。

input.value === person1.id