Блог

У меня есть страница Google, где данные о запасах обновляются каждые 3 минуты. У меня есть страница, на которой я могу видеть данные в таблице html. но эти данные не меняются автоматически. Мне нужно обновить страницу, или я должен установить мета lt;meta http-equiv="refresh" content="30"gt; , чтобы периодически обновлять страницу.

Я хочу, чтобы данные, поступающие из JSON, должны обновляться автоматически без обновления страницы. вот мой код.

Ссылка на объект JSON

 https://docs.google.com/spreadsheets/d/xxxxxxxxxx.json  

Div для отображения данных json

 lt;div id="json"gt;json herelt;/divgt;  

Javascript для извлечения и отображения данных json

 lt;script type="text/javascript"gt; var id = 'xxxxxxxxxxxxxxxxxxxx'; var gid = '0'; var url = 'https://docs.google.com/spreadsheets/d/' id '/gviz/tq?tqx=out:jsonamp;tqamp;gid=' gid; fetch(url)  .then(response =gt; response.text())  .then(data =gt; document.getElementById("json").innerHTML=myItems(data.substring(47).slice(0, -2))   ); function myItems(jsonString){  var json = JSON.parse(jsonString);  var table = 'lt;tablegt;lt;trgt;'  json.table.cols.forEach(colonne =gt; table  = 'lt;thgt;'   colonne.label   'lt;/thgt;')  table  = 'lt;/trgt;'  json.table.rows.forEach(ligne =gt; {  table  = 'lt;trgt;'  ligne.c.forEach(cellule =gt; {  try{var valeur = cellule.f ? cellule.f : cellule.v}  catch(e){var valeur = ''}  table  = 'lt;tdgt;'   valeur   'lt;/tdgt;'  }  )  table  = 'lt;/trgt;'  }  )  table  = 'lt;/tablegt;'  return table } lt;/scriptgt;  

Я знаю одну js-библиотеку kickout js, но я не могу реализовать и получить желаемый результат с помощью kickout js. итак, как я могу создать таблицу, которая автоматически обновляет данные JSON без обновления страницы ?

Заранее спасибо.

Вы должны периодически извлекать новые данные с помощью setInterval и обновлять строки таблицы. Вы можете назначить уникальный идентификатор каждой строке и обновлять их в своей функции, которая периодически запускается.

 setInterval(function() {  // fetch data here and update rows. }, 180000);