Я работаю над страницей, которая читает данные json и динамически создает таблицу со списком URL-адресов из данных JSON.
Теперь эти данные таблицы должны отображаться в iframe
как оглавление, и когда пользователь нажимает на любой из URL, он должен загрузить страницу в том же iframe
, и пользователь может перемещаться по страницам с помощьюследующая и предыдущая кнопка.
Я написал код для чтения данных JSON и динамического создания таблицы.У меня проблема с отображением этих табличных данных в iframe
оглавлении.
<body onload="CreateTableFromJSON()">
<p id="showData"></p>
</body>
<script>
function CreateTableFromJSON() {
var myTemplates = [
{
"Name": "Template 1",
"url": "http://www.w3schools.com"
},
{
"Name": "Template 2",
"url": "http://www.google.com"
}
]
var col = [];
for (var i = 0; i < myTemplates.length; i++) {
for (var key in myTemplates[i]) {
if (col.indexOf(key) === -1) {
col.push(key);
}
}
}
// CREATE DYNAMIC TABLE.
var table = document.createElement("table");
// TABLE ROW.
var tr = table.insertRow(-1);
var tbIndex = 1;
// ADD JSON DATA TO THE TABLE AS ROWS.
for (var i = 0; i < myTemplates.length; i++) {
tr = table.insertRow(-1);
var tabCell = tr.insertCell(-1);
//tabCell.innerHTML = tbIndex + ". "+ myTemplates[i].Name + myTemplates[i].url;
tabCell.innerHTML = tbIndex + ". " + '<a href="' + myTemplates[i].url + '">' + myTemplates[i].Name + '</a>';
tbIndex++;
}
// FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER.
var divContainer = document.getElementById("showData");
divContainer.innerHTML = "";
divContainer.appendChild(table);
}
</script>