Merge branch 'main' of https://github.com/VincentRamiere/Brief_starWars
This commit is contained in:
commit
b6904486e8
27
films.html
27
films.html
|
@ -0,0 +1,27 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Brief Star Wars - Films</title>
|
||||||
|
|
||||||
|
<script src="./scripts/films.js" defer></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>People</h1>
|
||||||
|
<section id="container" style="font-size:12px;">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="boutons">
|
||||||
|
<button class="allButtons" name="moins" value="-1"> < </button>
|
||||||
|
<div id="buttons"></div>
|
||||||
|
<button class="allButtons" name="plus" value="+1"> > </button>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,27 @@
|
||||||
|
const FILMS = document.getElementById('container');
|
||||||
|
const API_URL = "https://swapi.dev/api/films";
|
||||||
|
|
||||||
|
|
||||||
|
fetch(API_URL)
|
||||||
|
.then((reponse) => {
|
||||||
|
//console.log(reponse);
|
||||||
|
return reponse.json()
|
||||||
|
})
|
||||||
|
.then(reponseFormat => {
|
||||||
|
for(let index = 0; index < reponseFormat.results.length; index++){
|
||||||
|
//console.log(reponseFormat.results[index]);
|
||||||
|
const data = reponseFormat.results[index];
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
FILMS.innerHTML +=`
|
||||||
|
<p div class="films">${data.title}</p>
|
||||||
|
<p div id="episode_id">${data.episode_id}</p>
|
||||||
|
<p div id="opening_crawl">${data.opening_crawl}</p>
|
||||||
|
<p div id="director">${data.director}</p>
|
||||||
|
<p div id="producer">${data.producer}</p>
|
||||||
|
<p div id="release_date">${data.release_date}</p>
|
||||||
|
<p div id="starships">${data.starships}</p>
|
||||||
|
<p div id="species">${data.starships}</p>
|
||||||
|
<hr>`
|
||||||
|
}
|
||||||
|
})
|
Loading…
Reference in New Issue