Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <meta charset="utf-8">
- <title>Home</title>
- </head>
- <body>
- <style>
- .cool {
- color: blue;
- }
- .hot {
- color: red;
- }
- </style>
- <p>Zadania z myszki</p>
- <p id="ex"></p>
- <ol id="ex3"></ol>
- <button onclick="ex1()" ondblclick="ex2()">Wyświetl imie</button>
- <button onclick="ex3()">ex 3</button>
- <button onmouseover="ex4()" onmouseout="ex4_1()">ex 4</button>
- <button onclick="add()">+</button>
- <button onclick="sub()">-</button>
- <button onclick="multiply()">*</button>
- <button onclick="divide()">/</button>
- <h1>Wynik</h1>
- <p id="wynik"></p>
- <button onmouseover="hot()" onmouseout="cool()">CLASS</button>
- <button onclick="ex7()">ex 7</button>
- <ol id="ex7">
- </ol>
- <ol>
- <li> foobar
- <button onclick="ex10(this)">X</button>
- </li>
- <li>
- barbuz
- <button onclick="ex10(this)">X</button>
- </li>
- </ol>
- <!--aaa-->
- <script>
- // Utwórz skrypt, który po kliknięciu na tekst „Wyświetl dane” na stronie wyświetli Twoje imię i nazwisko.
- const ex1 = () => {
- const name = "Jakub"
- const ex = document.getElementById("ex")
- ex.innerHTML = name
- }
- // Do poprzedniego zadania dodaj możliwość usuwania Twojego nazwiska po dwukrotnym kliknięciu na
- // tekst „Wyświetl dane”. dane
- const ex2 = () => {
- const ex = document.getElementById("ex")
- ex.innerHTML = ""
- }
- const ex3 = () => {
- // Utwórz skrypt do dodawania danych i tworzenia listy. Po kliknięciu na przycisk dodaj uruchamia się
- // okienko prompt i wprowadzamy dane , które są zapisywane do listy <li>. (Tworzenie elementów z
- // poprzednich zajęc).
- const text = document.createTextNode("hello world!");
- orderedList = document.getElementById("ex3")
- listElement = document.createElement("li");
- listElement.appendChild(text)
- }
- const ex4 = () => {
- // Do poprzednich zadań dodaj przycisk, który po najechaniu powiększa dane na 50px oraz po
- // opuszczeniu przez znacznik myszy przycisku tekst wraca do rozmiarów 12px.
- document.body.style.fontSize="50px"
- }
- const ex4_1 = () => {
- document.body.style.fontSize="12px"
- }
- // Dodaj 4 przyciski, które po kliknięciu wywołają okienko dialogowe prompt do którego wprowadzisz
- // dwie liczby A i B, a następnie zostaną wykonane obliczenia zgodne z nazwą przycisku. Przykład
- // poniżej. Słowo WYNIK jest wyświetlane w znaczniku H1, natomiast liczba wynikowa w akapicie
- const add = () => {
- const a = prompt("Podaj a")
- const b = prompt("Podaj b")
- const wynik = a + b
- const h1 = document.getElementById("wynik")
- h1.innerHTML = wynik
- }
- const sub = () => {
- const a = prompt("Podaj a")
- const b = prompt("Podaj b")
- const wynik = a - b
- const h1 = document.getElementById("wynik")
- h1.innerHTML = wynik
- }
- const multiply = () => {
- const a = prompt("Podaj a")
- const b = prompt("Podaj b")
- const wynik = a * b
- const h1 = document.getElementById("wynik")
- h1.innerHTML = wynik
- }
- const divide = () => {
- const a = prompt("Podaj a")
- const b = prompt("Podaj b")
- const wynik = a / b
- const h1 = document.getElementById("wynik")
- h1.innerHTML = wynik
- }
- // Dodaj przycisk, który będzie dodawał klasę i usuwał do wyświetlonych danych. Klasa COOL i HOT.
- // Dodawał klasę po przytrzymaniu na przycisku i usuwał po puszczeniu przycisku myszy.
- const hot = () => {
- document.body.setAttribute("class","hot")
- }
- const cool = () => {
- document.body.setAttribute("class","cool")
- }
- // Utwórz 4 elementową listę <li>. Po kliknięciu na wybrany element powinno się wyświetlić okienko
- // prompt do wprowadzania zmiany danych tylko w tym elemencie.
- const ex7 = () => {
- const ele = document.getElementById("ex");
- const items = ele.getElementsByTagName("li");
- for (let i = 1; i <= 4; i++) {
- const text = prompt("value?")
- const listItem = document.createElement("li");
- listItem.textContent = text;
- ele.appendChild(listItem);
- }
- }
- // Do elementów <li> dodaj przyciski. Po kliknieciu na dany przycisk elememty są usuwane.
- const ex10 = (ele) => {
- ele = ele.parentNode;
- ele.remove()
- }
- // Zadanie 12.
- // Utwórz skrypt dzięki, któremu będziesz mógł wyczyścić dane w wybranym elemencie. Do okienka
- // prompt podajemy numer indeksu listy.
- const ex12 = () => {
- const index = prompt("index?")
- const ele = document.getElementById("ex");
- const items = ele.getElementsByTagName("li");
- items[index].remove()
- }
- </script>
- </body>
- </html>
Add Comment
Please, Sign In to add comment