BananaMaster

22 - What is default in switch and the oninput event (JS lessons)

If you forgot something — click to go to the lesson.

Task 1.

Create an input type="text", a button, and a div. The user enters a planet name: "mercury" — "1st", "venus" — "2nd", "earth" — "3rd", "mars" — "4th". If something else is entered, display "undefined".

Task 2.

Create an input type="text" and a button. The user enters a role: "admin" — set the page background (body.style.background) to red, "user" — blue, "guest" — grey. If the input is empty, reset the background to white.

Task 3.

Create an input type="text", a button, and a div. The user enters a country: "france" — "Paris", "japan" — "Tokyo", "germany" — "Berlin". If something else is entered, display "no found".

Task 4.

Create an input type="text", a button, and a div. The user enters a day of the week: "monday" — "work", "saturday" — "weekend", "sunday" — "weekend". If something else is entered — display "unknown".

Task 5.

Create a select with options "km", "miles", "m", an input type="number", a button, and a div. Convert the value to meters: km × 1000, miles × 1609, m × 1.

Task 6.

Create an input type="text" and a div. In real time (oninput): if "happy" is entered — text color becomes green, "sad" — red, "angry" — orange, "calm" — blue. If something else is entered, reset the color to default (black).

TEXT

Task 7.

Create an input type="text" and a div. Implement real-time behavior (on input change): the user enters a battery level as a word — "full" — "100%", "half" — "50%", "low" — "20%", "empty" — "0%". If the input is empty, display "No".