如何使用innerHTML将对象值正确打印到DIV?
我正在Codecademy上学习一门课程,他们的许多初学者课程都使用console.log()命令来打印到控制台。但是,我想尝试使用Document.GetElementById()和innerHTML,但它不打印所选对象的详细信息,而只是打印"[Object Object]",而console.log()打印键的详细信息?
以下是我的代码:
<div id="myfrndDetails"></div>
<script>
var frnds = new Object();
frnds.bill = {
firstName: "Bill",
lastName: "Gates",
phoneNumber: "8778787"
}
frnds.steve = {
firstName: "Bill",
lastName: "Gates",
phoneNumber: "8778787"
}
var frndCard = function(frndName,frndLst) {
for (var onefrnd in frndLst) {
if (frndLst[onefrnd].firstName === frndName) {
document.getElementById("myfrndDetails").innerHTML = frndLst[onefrnd];
return frndLst[onefrnd];
}
}
};
frndCard("Bill",frnds);
</script>
解决方案
但它没有打印出所选对象的详细信息,而是 只打印"[对象对象]",
这是因为frndLst[onefrnd]是一个对象,其toString
方法将打印[object Object]
。
使用JSON.stringify(frndLst[onefrnd])
查看此对象的JSON表示
或,替换此行
document.getElementById("myfrndDetails").innerHTML = frndLst[onefrnd];
由
document.getElementById("myfrndDetails").innerHTML = "lastname - " + frndLst[onefrnd].lastName + " and phoneNumber " + frndLst[onefrnd].phoneNumber ;
相关文章