減少我的代碼

Question

我有以下的javascript許多的div

function savecells() { 
    for (var tt = 0; tt < 12; tt++) 
     localStorage.setItem(
      'savecellnoinsulation' + (tt + 1), 
      document.getElementById('noinsulation' + (tt + 1)).value 
     ); 
} 

的節省存儲如何以下負載存儲做到這一點？

function loadcells() { 

    if (localStorage.getItem('savecellnoinsulation1')) { 
     var answer = localStorage.getItem('savecellnoinsulation1'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation1').value = answer; 

    if (localStorage.getItem('savecellnoinsulation2')) { 
     var answer = localStorage.getItem('savecellnoinsulation2'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation2').value = answer; 

    if (localStorage.getItem('savecellnoinsulation3')) { 
     var answer = localStorage.getItem('savecellnoinsulation3'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation3').value = answer; 

    if (localStorage.getItem('savecellnoinsulation4')) { 
     var answer = localStorage.getItem('savecellnoinsulation4'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation4').value = answer; 

    if (localStorage.getItem('savecellnoinsulation5')) { 
     var answer = localStorage.getItem('savecellnoinsulation5'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation5').value = answer; 

    if (localStorage.getItem('savecellnoinsulation6')) { 
     var answer = localStorage.getItem('savecellnoinsulation6'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation6').value = answer; 

    if (localStorage.getItem('savecellnoinsulation7')) { 
     var answer = localStorage.getItem('savecellnoinsulation7'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation7').value = answer; 

    if (localStorage.getItem('savecellnoinsulation8')) { 
     var answer = localStorage.getItem('savecellnoinsulation8'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation8').value = answer; 

    if (localStorage.getItem('savecellnoinsulation9')) { 
     var answer = localStorage.getItem('savecellnoinsulation9'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation9').value = answer; 

    if (localStorage.getItem('savecellnoinsulation10')) { 
     var answer = localStorage.getItem('savecellnoinsulation10'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation10').value = answer; 

    if (localStorage.getItem('savecellnoinsulation11')) { 
     var answer = localStorage.getItem('savecellnoinsulation11'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation11').value = answer; 

    if (localStorage.getItem('savecellnoinsulation12')) { 
     var answer = localStorage.getItem('savecellnoinsulation12'); 
    } else { 
     var answer = ' '; 
    } 
    document.getElementById('noinsulation12').value = answer; 
} 

我確實嘗試過類似的方法，但未能正常工作。這甚至有可能嗎？不知道還有什麼要嘗試！

感謝

Answer 1

下面是反轉savecells()功能的功能。如果頁面佈局與保存它們的頁面相同，它將只取所有值並將它們放回原來的位置。

function retreiveCells() { 
    for (var tt = 0; tt < 12; tt++){ 
     document.getElementById('noinsulation' + (tt + 1)).value = localStorage.getItem('savecellnoinsulation' + (tt + 1)) || '' ; 
    } 
} 

Answer 2

我認爲你可以簡化：

if (localStorage.getItem('savecellnoinsulation4')) { 
    var answer = localStorage.getItem('savecellnoinsulation4'); 
} 
else { 
    var answer = ' '; 
} 

由：var answer = localStorage.getItem('savecellnoinsulationX') || '';

ANDS使用含有itmes，或者它剛剛結束的所有名字的數組，可以產生要檢查的字符串for loop

所以基本上以下應該工作：

for (var i=1; i<=12; i++) { 
    var itemStr = "noinsulation" + i; 
    var saveItemStr = "savecell" + item; 
    var answer = localStorage.getItem(saveItemStr) || ''; 
    document.getElementById(itemStr).value = answer; 
}