Théorie: (16 Points)
*Exercice 1:
1-d
2-a
3-a
4-a
5-d
6-c
7-a
8-b
*Exercice 2:
function maxElement(arr) {
if (!Array.isArray(arr) || arr.length === 0) {
return undefined;
}
return Math.max(...arr);
}
*Exercice 3:
Lorsque la souris passe au-dessus de l’image,
celle-ci est remplacée par "image2.jpg"
et le chemin est affiché dans le paragraphe.
Quand la souris quitte l’image,
celle-ci redevient "image1.jpg"
et le chemin est à nouveau affiché
dans le paragraphe.
Pratique : ( 24 Points )
1-function charger() {
const select = document.getElementById("listeLivres");
livres.forEach((livre, index) => {
const option = document.createElement("option");
option.value = index;
option.textContent = livre.titre;
select.appendChild(option);
});
afficher();
}
2-function afficher() {
const index = document.getElementById("listeLivres").value;
const livre = livres[index];
document.getElementById("titreLivre").textContent = livre.titre;
document.getElementById("prixLivre").textContent = livre.prix;
document.getElementById("imageLivre").src = livre.image;
}
3-function ajouter() {
const index = document.getElementById("listeLivres").value;
const livre = livres[index];
panier.push(livre);
total += livre.prix;
const li = document.createElement("li");
li.textContent = `${livre.titre} - ${livre.prix} Dhs`;
li.setAttribute("data-index", index);
document.getElementById("panier").appendChild(li);
document.getElementById("total").textContent = total;
}
4-function retirer() {
const select = document.getElementById("listeLivres");
const index = select.value;
const ul = document.getElementById("panier");
const items = ul.getElementsByTagName("li");
for (let i = 0; i < items.length; i++) {
if (items[i].getAttribute("data-index") === index) {
ul.removeChild(items[i]);
total -= livres[index].prix;
document.getElementById("total").textContent = total;
panier.splice(i, 1);
break;
}
}
}
5-<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Librairie Informatique</title>
</head>
<body onload="charger()">
<h2>Liste des livres</h2>
<select id="listeLivres" onchange="afficher()"></select>
<div id="infoLivre" style="margin-top: 10px;">
<p><strong>Titre :</strong> <span id="titreLivre"></span></p>
<p><strong>Prix :</strong> <span id="prixLivre"></span> Dhs</p>
<img id="imageLivre" src="" alt="Image du livre" width="100">
</div>
<button onclick="ajouter()">Ajouter au panier</button>
<button onclick="retirer()">Retirer du panier</button>
<h2>Panier</h2>
<ul id="panier"></ul>
<p><strong>Total :</strong> <span id="total">0</span> Dhs</p>
<script>
const livres = [
{"ISBN":"01234","titre":"Langage C","image":"langagec.jpg","prix":150},
{"ISBN":"56789","titre":"Programmation
Javascript","image":"javascript.jpg","prix":250},
{"ISBN":"11778","titre":"Laravel","image":"laravel.jpg","prix":200}
];
let panier = [];
let total = 0;
function charger() {
const select = document.getElementById("listeLivres");
livres.forEach((livre, index) => {
const option = document.createElement("option");
option.value = index;
option.textContent = livre.titre;
select.appendChild(option);
});
afficher();
}
function afficher() {
const index = document.getElementById("listeLivres").value;
const livre = livres[index];
document.getElementById("titreLivre").textContent = livre.titre;
document.getElementById("prixLivre").textContent = livre.prix;
document.getElementById("imageLivre").src = livre.image;
}
function ajouter() {
const index = document.getElementById("listeLivres").value;
const livre = livres[index];
panier.push(livre);
total += livre.prix;
const li = document.createElement("li");
li.textContent = `${livre.titre} - ${livre.prix} Dhs`;
li.setAttribute("data-index", index);
document.getElementById("panier").appendChild(li);
document.getElementById("total").textContent = total;
}
function retirer() {
const select = document.getElementById("listeLivres");
const index = select.value;
const ul = document.getElementById("panier");
const items = ul.getElementsByTagName("li");
for (let i = 0; i < items.length; i++) {
if (items[i].getAttribute("data-index") === index) {
ul.removeChild(items[i]);
total -= livres[index].prix;
document.getElementById("total").textContent = total;
panier.splice(i, 1);
break;
}
}
}
</script>
</body>
</html>
