創建innerHTML的JavaScript循環（Google Sheet）

Question

我使用Google工作表作爲源抓取一些數據。我有三個類似的查詢發生，但只有兩個是返回結果，並在我的表格單元格內工作。環顧四周後，我發現人們循環創建id =＃以包含在他們的HTML中，但我無法完全弄清楚我的語法。

以下是我目前使用的，（警告：Noobie代碼前）

<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
google.load('visualization', '1', {packages: ['gauge']}); 
google.setOnLoadCallback(queryValue); 
function queryValue() { 
var query = new google.visualization.Query('https://spreadsheets.google.com/spreadsheet/tq?range=B22:B37&key=0AhCv9Xu_eRnSdFNhSzNQUFd3b1ZfRHgtQURINFpzeGc&gid=7'); 
query.send(function (response) { 
    if (response.isError()) { 
     alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); 
     return; 
    } 
    var data = response.getDataTable(); 

    // fetch the data from range B22:B37 into the span "bx" 
    // These are date labels 
    document.getElementById('b22').innerHTML = data.getValue(0, 0); 
    document.getElementById('b23').innerHTML = data.getValue(1, 0); 
    document.getElementById('b24').innerHTML = data.getValue(2, 0); 
    document.getElementById('b25').innerHTML = data.getValue(3, 0); 
    document.getElementById('b26').innerHTML = data.getValue(4, 0); 
    document.getElementById('b27').innerHTML = data.getValue(5, 0); 
    document.getElementById('b28').innerHTML = data.getValue(6, 0); 
    document.getElementById('b29').innerHTML = data.getValue(7, 0); 
    document.getElementById('b30').innerHTML = data.getValue(8, 0); 
    document.getElementById('b31').innerHTML = data.getValue(9, 0); 
    document.getElementById('b32').innerHTML = data.getValue(10, 0); 
    document.getElementById('b33').innerHTML = data.getValue(11, 0); 
    document.getElementById('b34').innerHTML = data.getValue(12, 0); 
    document.getElementById('b35').innerHTML = data.getValue(13, 0); 
    document.getElementById('b36').innerHTML = data.getValue(14, 0); 
    document.getElementById('b37').innerHTML = data.getValue(15, 0); 
}); 
} 
google.setOnLoadCallback(queryValue1); 
function queryValue1() { 
var query = new google.visualization.Query('https://spreadsheets.google.com/spreadsheet/tq?range=A22:A37&key=0AhCv9Xu_eRnSdFNhSzNQUFd3b1ZfRHgtQURINFpzeGc&gid=7'); 
query.send(function (response) { 
    if (response.isError()) { 
     alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage()); 
     return; 
    } 
    var data1 = response.getDataTable(); 

    // fetch the data from range A22:A37 into the span "bx" 
    // These are the labels on the top of the gauges and I want to turn the color of the gauge range. (i.e. <70:red, 71-89:yellow, 90-100:red) 
    document.getElementById('a22').innerHTML = data1.getValue(0, 0); 
    document.getElementById('a23').innerHTML = data1.getValue(1, 0); 
    document.getElementById('a24').innerHTML = data1.getValue(2, 0); 
    document.getElementById('a25').innerHTML = data1.getValue(3, 0); 
    document.getElementById('a26').innerHTML = data1.getValue(4, 0); 
    document.getElementById('a27').innerHTML = data1.getValue(5, 0); 
    document.getElementById('a28').innerHTML = data1.getValue(6, 0); 
    document.getElementById('a29').innerHTML = data1.getValue(7, 0); 
    document.getElementById('a30').innerHTML = data1.getValue(8, 0); 
    document.getElementById('a31').innerHTML = data1.getValue(9, 0); 
    document.getElementById('a32').innerHTML = data1.getValue(10, 0); 
    document.getElementById('a33').innerHTML = data1.getValue(11, 0); 
    document.getElementById('a34').innerHTML = data1.getValue(12, 0); 
    document.getElementById('a35').innerHTML = data1.getValue(13, 0); 
    document.getElementById('a36').innerHTML = data1.getValue(14, 0); 
    document.getElementById('a37').innerHTML = data1.getValue(15, 0); 
}); 
} 

Answer 1

爲了做一個循環，你可以使用一個起點和一個終點，然後簡單地使用各增加值你的代碼。

---

因爲你基本上是從0循環到15，開始將0，並且包容年底將15。您的ID只是被22所抵消，並且之前是"b"，所以我們使用加法來抵消數字，並且使用連接來加入"b"。

for (var i = 0; i <= 15; i++) { 
    document.getElementById('b' + (i + 22)).innerHTML = data.getValue(i, 0); 
}