89 lines
3.6 KiB
HTML
89 lines
3.6 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Übung 22: Die dunkle Seite schlägt zurück …</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<div class="container py-5">
|
|
<div class="alert alert-primary my-5">
|
|
<h2>Übung 22: Die dunkle Seite schlägt zurück …</h2>
|
|
|
|
<p>
|
|
Endlich setzt du deinen Kampf gegen die dunkle Seite von JS fort (siehe Übung 20) und erstellst zwei neue
|
|
»Kampf-Sequenzen«:
|
|
</p>
|
|
<p>»What's the German word for if« (Mehrere Lösungsmöglichkeiten: wenn, falls).</p>
|
|
<p>»Now, please enter a string with a length between 8 and 15 characters …«</p>
|
|
</div>
|
|
<div class="alert alert-primary">
|
|
<h2>Übung 23: Die dunkle Seite schlägt zurück…</h2>
|
|
<p>
|
|
Endlich setzen Sie Ihren Kampf gegen die dunkle Seite von JS fort (siehe Übung 20) und erstellen zwei neue
|
|
»Kampf-Sequenzen«:
|
|
</p>
|
|
<ul class="list">
|
|
<li>»What's the German word for if« (Mehrere Lösungsmöglichkeiten: wenn, falls).</li>
|
|
<li>»Now, please enter a string with a length between 8 and 15 characters…«</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<script>
|
|
'use strict';
|
|
|
|
const QUESTION_1 = 'Welcher Operator hat eine höhere Priorität: * oder + ?';
|
|
const SOLUTION_1 = '*';
|
|
|
|
const QUESTION_2 = 'Was ist das deutsche Wort für if?';
|
|
const SOLUTION_2_1 = 'wenn';
|
|
const SOLUTION_2_2 = 'falls';
|
|
|
|
const QUESTION_3 = 'Geben Sie bitte einen String mit einer Länge von 8 bis 15 Zeichen ein';
|
|
const SOLUTION_3_1 = 8;
|
|
const SOLUTION_3_2 = 15;
|
|
|
|
const outputEl = document.querySelector('.output');
|
|
|
|
const username = prompt('Bitte geben Sie ihren Vornamen ein: ');
|
|
alert(`Willkommen beim Spiel, die dunkle Seite von JS, ${username}!`);
|
|
|
|
const playerFitness = prompt(
|
|
`${username}, fühlen Sie sich bereit gegen die dunkle Seite von JS anzutreten? Bitte antworten Sie mit ja oder nein (y/n)`,
|
|
)
|
|
.trim()
|
|
.toLowerCase();
|
|
|
|
if (playerFitness === 'ja' || playerFitness === 'y') {
|
|
alert('Okay, mögen die Spiele beginnen');
|
|
|
|
const answer1 = prompt(QUESTION_1).trim().toLowerCase();
|
|
if (answer1 === SOLUTION_1) {
|
|
alert(`Richtige Antwort, ${username}! Die helle Seite ist stark in dir!`);
|
|
} else {
|
|
alert(`${username}, leider lagst du falsch. Die dunkle Seite von JS hat gewonnen!`);
|
|
}
|
|
|
|
const answer2 = prompt(QUESTION_2).trim().toLowerCase();
|
|
if (answer2 === SOLUTION_2_1 || answer2 === SOLUTION_2_2) {
|
|
alert(`Richtige Antwort, ${username}! Die helle Seite ist weiterhin stark in dir!`);
|
|
} else {
|
|
alert(`${username}, leider lagst du falsch. Die dunkle Seite wächst in dir!`);
|
|
}
|
|
|
|
const answer3 = Number(prompt(`${username}! ${QUESTION_3}`));
|
|
if (answer3.length >= SOLUTION_3_1 && answer3.length <= SOLUTION_3_2) {
|
|
alert(`Richtige Antwort, ${username}! Die helle Seite ist stark in dir!`);
|
|
} else {
|
|
alert(`${username}, leider lagst du falsch. Die dunkle Seite ist stark in dir!`);
|
|
}
|
|
} else {
|
|
alert(`${username}, die dunkle Seite ist stark in dir!`);
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|