urlから複数の要素を配列のjQueryにロード

Question

私はJSのエキスパートではありません。同じドメインの他のページから複数の要素のコンテンツを読み込む際には助けが必要です。私は今、これを持っている：

$(document).ready(function(){ 
    $('div.container').each(function(){ 
    var link = $(this).find('a').attr('href'); 
    var table = $('<table></table>').addClass('params'); 
    for(i=1; i<4; i++){ 
     var row = $('<tr />').addClass('param_' + i).html('<td class="val" />'); 
     table.append(row); 
    }; 
    $(this).append(table); 
    $(this).find('tr.param_1 td.val').load(link + ' #content1'); 
    $(this).find('tr.param_2 td.val').load(link + ' #content2'); 
    $(this).find('tr.param_3 td.val').load(link + ' #content3'); 
    }); 
}); 

それは動作しますが、あなたは、現在のページと各「div.container」に関する複数のdivコンテナがある見ることができるように、それぞれのURLから、それに配置された複数の要素を取得する必要があります。 URLを一度スキャンしてすべての要素の内容を配列に取得して、ロード時間が長くなり過ぎるため、すべてのページを何度もロードしないようにしたいと考えています。

他にも提案があります。しかし、私はjQueryだけを理解していることを覚えておいてください。私が見つけたすべての答えは非常に曖昧でした。

ありがとうございます。ヘルプは非常に感謝しています。

Answer 1

ローカルストレージを使用する必要があります。

以下のコードは役に立ちましたか？

$(this).find('td[id^="tr_id_"]').each(function(key,val){ 
    if (localStorage.getItem("tr_id_"+key) === null) { 
     /// Populate the data in td elements via local storage . 
     document.getElementById("tr_id_"+key).innerHTML = localStorage.getItem("tr_id_"+key); 

    }else{ 

     $(this).find('tr#tr_id_'+key).load(link); 
      /// Store the data in local storage . 
     var html_content = document.getElementById("tr_id_"+key).innerHTML; 
    localStorage.setItem("tr_id_"+key,html_content); 

    } 
});