pdx-peculiarties/js/load.js
david b7760ab0d1
All checks were successful
PDX Pecularities Server / deploy (push) Successful in 1s
website formatting
2025-04-07 20:03:29 -07:00

33 lines
1016 B
JavaScript

const loadSection = (sectionName) =>{
fetch(`data/${sectionName}.json`)
.then(response => response.json())
.then(data => {
const container = document.getElementById(sectionName);
container.innerHTML = renderItems(data)
})
.catch(error => console.error('Error loading JSON:', error));
}
// Recursive function to handle strings, arrays, and objects
const renderItems = (items) => {
return items.map(item => {
if (typeof item === 'string') {
return `<p>${item}</p>`;
} else if (Array.isArray(item)) {
return renderItems(item); // recurse into nested array
} else if (typeof item === 'object') {
return `<p>${Object.entries(item).map(([key, value]) =>
`<strong>${key}:</strong> ${value}`).join('<br>')}</p>`;
} else {
return `<p>${String(item)}</p>`;
}
}).join('');
};
const sections = document.getElementsByClassName('section')
Array.from(sections).forEach(section =>{
loadSection(section.id)
})