我已經在JavaScript中創建了一個對象數組。如何在瀏覽器窗口中打印對象數組，類似於PHP中的print_r函數？如何在JavaScript中打印對象數組？
var lineChartData = [{
date: new Date(2009, 10, 2),
value: 5
}, {
date: new Date(2009, 10, 25),
value: 30
}, {
date: new Date(2009, 10, 26),
value: 72,
customBullet: "images/redstar.png"
}];
只需使用
yourContainer.innerHTML = JSON.stringify(lineChartData);
如果你想要的東西更漂亮，做
yourContainer.innerHTML = JSON.stringify(lineChartData, null, 4);
但如果你只是這樣做是爲了調試，那麼你更好的use the console與console.log(lineChartData)。
document.getElementById('container').innerHTML = lineChartData[array_index]
如果您使用的是Chrome，你也可以使用
console.log(yourArray);
簡單的功能，以提醒對象或數組的內容。
使用數組或字符串或其提醒內容的對象調用此函數。
功能
function print_r(printthis, returnoutput) {
var output = '';
if($.isArray(printthis) || typeof(printthis) == 'object') {
for(var i in printthis) {
output += i + ' : ' + print_r(printthis[i], true) + '\n';
}
}else {
output += printthis;
}
if(returnoutput && returnoutput == true) {
return output;
}else {
alert(output);
}
}
使用
var data = [1, 2, 3, 4];
print_r(data);
我用下面的函數來顯示在Firefox控制檯日誌的讀出：
//// make printable string for console readout, recursively
var make_printable_object = function(ar_use)
{
//// internal arguments
var in_tab = arguments[1];
var st_return = arguments[2];
//// default vales when applicable
if (!in_tab) in_tab = 0;
if (!st_return) st_return = "";
//// add depth
var st_tab = "";
for (var i=0; i < in_tab; i++) st_tab = st_tab+"-~-~-";
//// traverse given depth and build string
for (var key in ar_use)
{
//// gather return type
var st_returnType = typeof ar_use[key];
//// get current depth display
var st_returnPrime = st_tab+ "["+key+"] ->"+ar_use[key]+"< is {"+st_returnType+"}";
//// remove linefeeds to avoid printout confusion
st_returnPrime = st_returnPrime.replace(/(\r\n|\n|\r)/gm,"");
//// add line feed
st_return = st_return+st_returnPrime+"\n";
//// stop at a depth of 15
if (in_tab>15) return st_return;
//// if current value is an object call this function
if ((typeof ar_use[key] == "object") & (ar_use[key] != "null") & (ar_use[key] != null)) st_return = make_printable_object(ar_use[key], in_tab+1, st_return);
}
//// return complete output
return st_return;
};
Examp樂：
console.log(make_printable_object(some_object));
或者，只需更換：
st_return = st_return+st_returnPrime+"\n";
與
st_return = st_return+st_returnPrime+"<br/>";
在html頁面打印出來。
你可以使用下面的語法和對象將在控制檯中盡顯：
console.log('object evt: %O', object);
我使用Chrome瀏覽器不知道這是否是適應於其他瀏覽器。
你檢查
console.table(yourArray);
更多的相關信息在這裏：https://developer.mozilla.org/en-US/docs/Web/API/Console/table
電解金屬錳...爲什麼不使用這樣的事情？
function displayArrayObjects(arrayObjects) {
var len = arrayObjects.length, text = "";
for (var i = 0; i < len; i++) {
var myObject = arrayObjects[i];
for (var x in myObject) {
text += (x + ": " + myObject[x] + " ");
}
text += "<br/>";
}
document.getElementById("message").innerHTML = text;
}
var lineChartData = [{
date: new Date(2009, 10, 2),
value: 5
}, {
date: new Date(2009, 10, 25),
value: 30
}, {
date: new Date(2009, 10, 26),
value: 72,
customBullet: "images/redstar.png"
}];
displayArrayObjects(lineChartData);<h4 id="message"></h4>結果：
date: Mon Nov 02 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 5
date: Wed Nov 25 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 30
date: Thu Nov 26 2009 00:00:00 GMT+0200 (FLE Standard Time) value: 72 customBullet: images/redstar.png
我用我的自定義功能在控制檯打印陣列
this.print = function (data,bpoint=0) {
var c = 0;
for(var k=0; k<data.length; k++){
c++;
console.log(c+' '+data[k]);
if(k!=0 && bpoint === k)break;
}
}
用法：print（array）;
或 print（array，50）; // 50值僅打印
使用'console.log（lineChartData）'將其記錄到控制檯。 – Rob 2013-02-15 13:01:43
您可以使用'console.debug（lineChartData）'來查看控制檯中的對象。 （在Firefox中：工具 - > Web開發人員 - > Web控制檯（或Ctrl + Shift + K） - 或者下載[Firebug]（https://getfirebug.com/） – 2013-02-15 13:03:46