c2023/paip2
17
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
baiobelfer 2025-09-11 11:00:04 +02:00
commit 04475fc929
3 changed files with 75 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
data/data.json Normal file
View File

@ -0,0 +1,8 @@
{
"title":"Template",
"Author":"mpabi",
"lst":[
{"id":1, "name":"el1"},
{"id":2, "name":"el2"}
]
}

45
index.html Normal file
View File

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
#list-wrapper {
max-width: 400px;
margin-top: 15px;
padding: 10px;
border: 1px solid #ddd;
border-radius: 6px;
background-color: #f9f9f9;
}
ul {
list-style-type: none;
padding: 0;
}
li {
padding: 8px;
margin: 4px 0;
background-color: #fff;
border: 1px solid #eee;
border-radius: 4px;
}
</style>
<script src="js/script.js" defer> </script>
</head>
<body>
<h1>Loading Data...</h1>
<!-- Lista opakowana w div z id -->
<div id="list-wrapper">
<ul id="item-list"></ul>
</div>
</body>
</body>
</html>

22
js/script.js Normal file
View File

@ -0,0 +1,22 @@
console.log("Hello world");
fetch ("./data/data.json")
.then ( response => {
return response.json();
})
.then (data => {
console.log("ok")
// Nadaj tytuł z danych
document.querySelector("h1").textContent = data.title;
const listContainer = document.getElementById("item-list");
// Wypełnij listę elementami z 'lst'
data.lst.forEach(item => {
const li = document.createElement("li");
li.textContent = `ID: ${item.id}, Name: ${item.name}`;
listContainer.appendChild(li);
});
})