在網站開發過程中，經常需要將數據從數據庫中讀取并展示到頁面上。而在展示時，我們往往需要按照一定的格式進行輸出，以便頁面能夠更好地呈現數據。在本文中，我們將介紹如何使用JavaScript來格式化輸出MySQL數據庫中的數據。

首先，我們需要先從數據庫中獲取數據。這可以通過使用服務器端的編程語言（如PHP、ASP.NET等）來實現。這里我們不再贅述，假定我們已經成功獲取到了數據。

// 假設我們從數據庫中獲取的數據為以下格式：
var data = [
{ id: 1, name: 'John', age: 20, gender: 'Male' },
{ id: 2, name: 'Mary', age: 30, gender: 'Female' },
{ id: 3, name: 'Tom', age: 25, gender: 'Male' }
];

接下來，我們將通過JavaScript來格式化輸出這些數據。

首先，我們可以使用循環來逐行輸出數據：

for (var i = 0; i < data.length; i++) {
var row = data[i];
var line = row.id + '\t' + row.name + '\t' + row.age + '\t' + row.gender;
console.log(line);
}

上面的代碼中，我們將每行數據拼接成一個字符串，并使用制表符（\t）來分隔每個字段。然后，通過console.log來輸出每行數據，從而實現格式化輸出。

如果我們想要在頁面中展示這些數據，我們可以使用一個HTML表格來實現。

var table = document.createElement('table');
// 添加表頭
var thead = document.createElement('thead');
var trHead = document.createElement('tr');
var thId = document.createElement('th');
thId.innerText = 'ID';
var thName = document.createElement('th');
thName.innerText = 'Name';
var thAge = document.createElement('th');
thAge.innerText = 'Age';
var thGender = document.createElement('th');
thGender.innerText = 'Gender';
trHead.appendChild(thId);
trHead.appendChild(thName);
trHead.appendChild(thAge);
trHead.appendChild(thGender);
thead.appendChild(trHead);
table.appendChild(thead);
// 添加表格內容
var tbody = document.createElement('tbody');
for (var i = 0; i < data.length; i++) {
var row = data[i];
var tr = document.createElement('tr');
var tdId = document.createElement('td');
tdId.innerText = row.id;
var tdName = document.createElement('td');
tdName.innerText = row.name;
var tdAge = document.createElement('td');
tdAge.innerText = row.age;
var tdGender = document.createElement('td');
tdGender.innerText = row.gender;
tr.appendChild(tdId);
tr.appendChild(tdName);
tr.appendChild(tdAge);
tr.appendChild(tdGender);
tbody.appendChild(tr);
}
table.appendChild(tbody);
// 將表格添加到頁面中
document.body.appendChild(table);

上面的代碼中，我們首先創建了一個HTML表格，并分別創建了表頭和表格內容。然后，我們循環遍歷數據，并使用createElement來創建表格行和單元格，并將數據填充到相應的單元格中。最后，將表格添加到頁面中，從而實現了格式化輸出MySQL數據庫中的數據。