如何在浏览器窗口中显示此javascript片段的结果

How can I display the results of this javascript snippet in a browser window?

本文关键字：javascript 片段 结果 显示 浏览器 窗口      更新时间：2023-09-26

我可以理解console.log中发生的事情，但我想在浏览器窗口中显示代码。我想我应该使用document.write，但我对此不确定。

var friends = {
bill: {
    firstName: "Bill",
    lastName: "Gates",
},
steve: {
    firstName: "Steve",
    lastName: "Gates",
}
};
var list = function(friends){
for (var key in friends){
    console.log(key);
}
};
var search = function(name){
for (var key in friends){
     if (friends[key].firstName === name){
    console.log(friends[key]);
    return friends[key];
    }   
}
};

您可以使用alert函数

alert("Hello World")

或者你可以使用

document.write("Hello World")

它将字符串"Hello World"输出到html中js片段的位置。或者，您可以操作DOM并在div或span标记上设置innerHTML。如果你像这样在html中添加一个带有id的标签，

<span id="foo"></span>

你可以用设置html内容

document.getElementById("foo").innerHTML = "Hello World"

当然，如果您的问题是序列化函数的结果，请使用JSON.Stringify

alert(JSON.stringify({"hello": "world", 3: "bar"}));

为了显示哈希，您可以使用document.write，但您需要像这样"字符串化"数据：

document.write(JSON.Stringify(friends));`

如果你想要更漂亮的东西：

document.write(JSON.stringify(friends, null, "<br/>"))

文件：https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

另一种可能性是使用jQuery的.html（）来修改页面上现有的html元素。

var showFriends=function(){
var x = JSON.stringify(friends,null,'</br>');
$('#myDiv').html('<p>'+x+'</p>');
};

jsfiddle：http://jsfiddle.net/wLZff/

相关文章：