使用JSON數據生成html片段並將片段插入DOM

Question

我正在構建一個類似於pininterest的單頁應用程序，我以20爲增量獲取JSON數據。我的項目不支持Angularjs，主幹鬍鬚或任何此類框架或圖書館。

我需要在確定下面列出我的問題的解決方案幫助：

1. 我想我去耦的瓷磚HTML（帶圖像和不帶）作爲模板。
2. 在收到JSON數據的前20項內容時，我想構建瓷磚並將其注入到我的主index.html中。如何調用從21-40和40-60開始的JSON數據。 JSON數據具有編號屬性，稱爲rank：1，rank：2等。

我正在尋找使用Javascript或jQuery的前端解決方案。

Answer 1

您正在描述我對SPA應用程序所做的事情。我在博客的主頁視圖http://love2dev.com上實現了一個非常類似的功能。儘管如此，我不會爲新的分塊進行分頁。

你是對的，你不需要任何龐大的框架來執行你所需要的。至於模板，我使用MUSTACHE或基於這篇文章http://tech.pro/tutorial/1743/javascript-template-engine-in-just-20-lines。我實際上在我的博客中使用了20行功能。在我的新SPA書中，我使用了MUSTACHE，這取決於你。

要調用接下來的20條記錄，您需要配置API以允許您檢索分頁數據集。這可以通過查詢字符串參數或路由變量來完成。它是由你決定。通常你有一個頁面＃和總記錄的參數。如果您需要實際的AJAX層面的幫助，我會考慮滾動您自己的或使用reqwest，https://github.com/ded/reqwest?source=cc。