JS

Question

我尝试将 2 JS对象：A和B存储在名为data的变量中。

JS

var data = {

      "A":{"section_num":"2.2", "problem_set":"Same", "start_time":"7/20/2015 10:00 am", "student_am":"9", "due_time":"7/20/2015 11:00 am", "submit":"9", "avg_score":"71", "danger":"5", "danger_list":"5,10,15,19,23", "warning":"8", "warning_list":"3,7,11,13,14,16,21,22", "success":"12", "success_list":"1,2,4,6,8,9,12,17,18,20,24,25"},

      "B":{"section_num":"2.3", "problem_set":"Not the same", "start_time":"6/19/2015 1:00 pm", "student_am":"23", "due_time":"6/19/2015 2:00 pm", "submit":"7", "avg_score":"82", "danger":"10", "danger_list":"11,12,13,14,15,16,17,18,19,20", "warning":"10", "warning_list":"1,2,3,4,5,6,7,8,9,10", "success":"5", "success_list":"21,21,23,24,25"}

};


 var print_a = document.getElementById("print_a");
 var print_b = document.getElementById("print_b");



print_a.html(data.A.start_time);
print_b.innnerHTML = data.B.start_time;
print_a.text(data.A.start_time);

HTML

<h1 id="print_a"> </h1>
<h1 id="print_b"> </h1>

我只想将它们打印出来。我尝试过使用点符号来访问它们。但目前还没有打印出来的东西。

控制台中出现

0 错误。

我做错了什么？

任何提示/建议？

如果您需要 - here is Fiddle

Answer 1

html()和text()等函数存在于jQuery中，但不存在于本机JavaScript中。如果我从你的JSFiddle中删除它们，我会得到输出。我很容易通过在JSFiddle上打开Chrome开发工具并按下运行来检测到这是问题 - 在控制台上记录了错误。

这是更新后的JSFiddle：http://jsfiddle.net/4yw6cbf2/3/

没有标准的方法来打印匿名对象。如果您有一个类并且正在创建该类的实例，则可以添加toString方法。一个问题是对象具有键和值，并且键不是有序的。您可以使用Object.keys(myObject)访问密钥，这将返回一个数组。然后，您可以迭代数组并打印出键和值。

以下是一个例子：

var span = document.getElementById('output');

var myObject = {
    a: 10,
    b: 'cat',
    c: 'San Francisco'
};

span.innerHTML = Object.keys(myObject).map(function(key) {
    return key + ': ' + myObject[key];
}).join(', ');

JSFiddle：http://jsfiddle.net/e4vjvc8d/

对于我来说，在OS X上的最新Google Chrome上，它会按照a，b，c的顺序打印出来但不保证该顺序，请务必记住这一点。

如果您只想要一个可打印的对象，您还可以使用JSON.stringify将对象序列化为JSON。这将为您提供上述示例对象的输出：

'{"a":10,"b":"cat","c":"San Francisco"}'

参考：MDN on JSON

Answer 2

我建议使用elem.textContent

// example: dump entire object contents using JSON.stringify
print_a.textContent = JSON.stringify(data.A);
print_b.textContent = JSON.stringify(data.B);

单击下面的运行代码段以查看其是否正常工作

＆＃13;

var data = {

      "A":{"section_num":"2.2", "problem_set":"Same", "start_time":"7/20/2015 10:00 am", "student_am":"9", "due_time":"7/20/2015 11:00 am", "submit":"9", "avg_score":"71", "danger":"5", "danger_list":"5,10,15,19,23", "warning":"8", "warning_list":"3,7,11,13,14,16,21,22", "success":"12", "success_list":"1,2,4,6,8,9,12,17,18,20,24,25"},

      "B":{"section_num":"2.3", "problem_set":"Not the same", "start_time":"6/19/2015 1:00 pm", "student_am":"23", "due_time":"6/19/2015 2:00 pm", "submit":"7", "avg_score":"82", "danger":"10", "danger_list":"11,12,13,14,15,16,17,18,19,20", "warning":"10", "warning_list":"1,2,3,4,5,6,7,8,9,10", "success":"5", "success_list":"21,21,23,24,25"}

};


 var print_a = document.getElementById("print_a");
 var print_b = document.getElementById("print_b");

print_a.textContent = data.A.start_time;
print_b.textContent = data.B.start_time;

＆＃13;

div {
  background-color: #fafafa;
  padding: 10px;
  margin: 0 0 10px;
  font-family: monospace;
  white-space: pre-wrap;
}

＆＃13;

<div id="print_a"></div>
<div id="print_b"></div>

＆＃13;

组合JS对象并将其打印出来的最佳方法是什么？

JS

HTML

2 个答案: