Question

我正在尝试在网页上显示/附加我的Java脚本对象。我想显示每个键及其对应的值。

与我类似的大多数问题只有答案，建议将其记录到控制台或提醒它。不幸的是，这不是我想要的。

我也试过了JSON.stringify()，但这似乎只显示了一个文字博客。如果JSON.stringify()是将对象键/值对打印/输出到文档的唯一方法，那么无论如何要设置样式吗？

以下是我尝试过的一些但没有优先权。

JSON.stringify(object, null, 4));

object.__proto__.toString();

这是我想要的一个例子：

Name: John
Name: Bob
Name: Thomas

没有任何JSON格式的花括号或任何其他格式。只是纯文本。

编辑：我确实熟悉document.write()，这不是解决方案。我需要 APPEND 到已经包含内容，我的Javascript对象的键值和值对的网页。

Javascript对象是动态的，长度未知。

这样的事情：

$('#container').html(object);
$('#container').append(object);

Answer 1

＆＃13;

const items =  { 'name': 'John', 'Rank': 2, 'Country': 'USA'  }

output.textContent = JSON.stringify(items, null, 2);

＆＃13;

<pre id="output"></pre>

＆＃13;

Answer 2

您可以这样做： -

var mydata = {'Ram':'100 points','Shyam':'200 points','Fred-ii':'800 points'};

$.each(mydata,function(key,value){
   $('#my-div').append("<span>"+key +":- "+value+"</span>")

});

#my-div{
float:left;
width:100%;
background:rgb(249, 247, 249);
}

#my-div span {
    float: left;
    width: 100%;
}

span:nth-child(even){
  color:green;
}
span:nth-child(odd){
  color:red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="my-div"></div>

Answer 3

以这种方式循环遍历对象并使用键和值进行工作 -

for (var key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key + " -> " + obj[key]);
}
}

在网页上显示Javascript对象键/值对

我正在尝试在网页上显示/附加我的Java脚本对象。我想显示每个键及其对应的值。

3 个答案: