Trang chủ Khám phá Trợ giúp
Đăng nhập
Volddemar4ik
/
homework
Xem 1
Star 0
Fork 0
Các tập tin Các vấn đề 20 Yêu cầu khéo về 0 Wiki
Browse Source

HW09 done

Volddemar4ik 2 năm trước cách đây
mục cha
e47fe632a2
commit
d6469ced37
2 tập tin đã thay đổi với 275 bổ sung và 0 xóa
Split View Hiển thị tình trạng sai khác
  1. 102 0
      js/09/HW09.html
  2. 173 0
      js/09/HW09.js

+ 102 - 0
js/09/HW09.html
Xem Tập Tin 

@@ -0,0 +1,102 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<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>Document</title>
 
+</head>
 
+
 
+<body>
 
+    <div class="table">
 
+        <!-- 
+Создайте HTML файл с :
 
+    <select id='from'> - исходная валюта
 
+    <select id='to'> - валюта в которую происходит обмен
 
+    <div id='rate'> - кросскурс между валютами
 
+    <input type='number' id='amount' /> - сумма в исходной валюте
 
+    <div id='result'> - сумма в валюте, в которую хотим поменять
 
+
 
+Используя заготовку из предыдущего задания, наполните select-ы тэгами option с названиями валют, используя цикл
 
+    document.createElement
 
+    innerText для option
 
+    from.append или to.append
 
+    За пределами цикла назначьте обработчики onchange для элементов select и oninput для элемента input, используя их id. По этим событиям обновляйте текст в div#rate и div#result
 
+ -->
 
+
 
+        <select name="" id="from"></select>
 
+        <select name="" id="to"></select>
 
+        <div id="rate"></div>
 
+        <input type="number" id="amount" />
 
+        <div id="result"></div>
 
+
 
+        <script>
 
+            fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
 
+                .then(data => {
 
+
 
+                    for (const [currency, value] of Object.entries(data.rates)) {
 
+
 
+                        const optionFrom = document.createElement('option')
 
+                        const optionTo = document.createElement('option')
 
+
 
+                        from.append(optionFrom)
 
+                        to.append(optionTo)
 
+
 
+                        optionFrom.innerText = optionTo.innerText = `${currency}`
 
+                        optionFrom.value = optionTo.value = `${value}`
 
+                    }
 
+
 
+
 
+                    from.onchange = to.onchange = amount.oninput = () => {
 
+                        rate.innerText = `кросскурс: ${(to.value / from.value).toFixed(2)}`
 
+                        result.innerText = `Вы получите: ${(to.value / from.value * +amount.value).toFixed(2)}`
 
+                    }
 
+
 
+                })
 
+        </script>
 
+    </div>
 
+
 
+    <div class="countries" style="margin-top: 50px;">
 
+        <!-- 
+    По аналогии с предыдущем заданием, реализуйте интерфейс выбора страны и города:
 
+        по закрузке данных наполняйте select#countries элементами option с названиями стран;
 
+        так же назначьте обработчик события onchange в select#countries, который:
 
+            удаляет старый контент select#cities (достаточно занести в innerHTML или innerText пустую строку)
 
+            добавляет в select#cities элементы option с городами из выбранной только что страны.
 
+    Таким образом, при изменении страны будет меняться список городов в select#cities
 
+ -->
 
+
 
+        <select name="" id="countries"></select>
 
+        <select name="" id="cities"></select>
 
+
 
+        <script>
 
+            fetch('https://raw.githubusercontent.com/russ666/all-countries-and-cities-json/master/countries.min.json').then(res => res.json())
 
+                .then(data => {
 
+
 
+                    for (const [country] of Object.entries(data)) {
 
+
 
+                        const optionCountries = document.createElement('option')
 
+                        countries.append(optionCountries)
 
+                        optionCountries.innerText = `${country}`
 
+
 
+                        countries.onchange = () => {
 
+
 
+                            cities.innerText = ''
 
+
 
+                            for (const city of data[countries.value]) {
 
+
 
+                                const optionCities = document.createElement('option')
 
+                                cities.append(optionCities)
 
+                                optionCities.innerText = `${city}`
 
+
 
+                            }
 
+
 
+                        }
 
+                    }
 
+                })
 
+        </script>
 
+    </div>
 
+</body>
 
+
 
+</html>

+ 173 - 0
js/09/HW09.js
Xem Tập Tin 

@@ -0,0 +1,173 @@
 
+// blocks
 
+{
 
+    // готово
 
+}
 
+
 
+
 
+
 
+// comparison if
 
+// Разберите пример
 
+// Добавьте условие отрицательного возраста в пример выше.Расставьте недостающие(но синтаксически необязательные) фигурные скобки.Выкиньте лишнее из текущего кода
 
+{
 
+    const age = +prompt("Сколько вам лет?", "");
 
+    if (age < 0) {
 
+        alert("Косишь под Бенджамина Баттона")
 
+    }
 
+    else {
 
+        if (age < 18) {
 
+            alert("школьник");
 
+        }
 
+        else {
 
+            if (age < 30) {
 
+                alert("молодеж");
 
+            }
 
+            else {
 
+                if (age < 45) {
 
+                    alert("зрелость");
 
+                }
 
+                else {
 
+                    if (age < 60) {
 
+                        alert("закат");
 
+                    }
 
+                    else {
 
+                        if (age > 60) {
 
+                            alert("как пенсия?");
 
+                        }
 
+                        else {
 
+                            alert("то ли киборг, то ли KERNESS");
 
+                        }
 
+                    }
 
+                }
 
+            }
 
+        }
 
+    }
 
+}
 
+
 
+
 
+
 
+// switch: sizes
 
+// Сделайте задание Comparison: sizes используя switch
 
+{
 
+    const sizes = prompt('Введите, размер чего будем ковертировать в американскую систему размеров:\nверхняя одежда, платья, брюки, женское белье, чулки, носки')
 
+    switch (sizes) {
 
+        case 'верхняя одежда':
 
+        case 'платья':
 
+        case 'брюки':
 
+            let firstPart = +prompt('Введите размер одежды в Украине')
 
+            alert(`Украинский ${firstPart} размер соответствует американскому ${6 + firstPart % 40} размеру`)
 
+            break;
 
+
 
+        case 'женское белье':
 
+            let secondPart = +prompt('Введите размер одежды в Украине')
 
+            alert(`Украинский ${secondPart} размер соответствует американскому ${8 + secondPart % 42} размеру`)
 
+            break;
 
+
 
+        case 'чулки':
 
+            let thirdPart = +prompt('Введите размер одежды в Украине')
 
+            alert(`Украинский ${thirdPart} размер соответствует американскому ${8 + (thirdPart % 21) / 2} размеру`)
 
+            break;
 
+
 
+        default: alert('Неправильная категория/мы такое не считаем')
 
+
 
+    }
 
+}
 
+
 
+
 
+
 
+// switch: if
 
+// Перепишите пример ниже, используя if
 
+// Обратите внимание, на пропуски break
 
+{
 
+    let color = prompt("Введите цвет", "");
 
+    if (color === 'red') {
 
+        document.write("<div style='background-color: red;'>красный</div>")
 
+        document.write("<div style='background-color: black; color: white;'>черный</div>")
 
+    }
 
+    else if (color === 'black') {
 
+        document.write("<div style='background-color: black; color: white;'>черный</div>")
 
+    }
 
+    else if (color === 'blue') {
 
+        document.write("<div style='background-color: blue;'>синий</div>")
 
+        document.write("<div style='background-color: green;'>зеленый</div>");
 
+    }
 
+    else if (color === 'green') {
 
+        document.write("<div style='background-color: green;'>зеленый</div>")
 
+    }
 
+    else {
 
+        document.write("<div style='background-color: gray;'>Я не понял</div>")
 
+    }
 
+}
 
+
 
+
 
+
 
+// noswitch
 
+// Напишите функцию noSwitch, которая принимает объект со значениями - функциями, ключ для объекта и запускает одну из функций из объекта если ключ найден, иначе - запускает default:
 
+{
 
+    const noSwitch = (key, cases, defaultKey = 'default') => {
 
+        if (key in cases)
 
+            cases[key]()
 
+        else cases.defaultKey()
 
+    }
 
+
 
+    const drink = prompt("Что вы любите пить")
 
+    noSwitch(drink, {
 
+        воду: () => console.log('Самый здоровый выбор!'),
 
+        чай() {
 
+            console.log('Вкусная и полезная штука. Не переусердствуйте с сахаром')
 
+        },
 
+        "пиво": () => console.log('Хорошо летом, да в меру'),
 
+        виски: function () {
 
+            console.log('Да вы, батенька, эстет! Не забудьте лед и сигару')
 
+        },
 
+        defaultKey() {
 
+            console.log('шото я не понял')
 
+        }
 
+    })
 
+}
 
+
 
+
 
+
 
+// closure calc
 
+// Напишите внутри анонимной функции, переданной в then(data =>):
 
+//      цикл, который перебирает курсы;
 
+//         на каждой итерации создается кнопка(document.createElement)
 
+//         текст кнопки - название валюты(innerHTML или innerText)
 
+//         Назначьте обработчик события на этой кнопке(onclick = () => {.....}).Функция - обработчик должна быть написана прямо в теле цикла
 
+//              Обработчик должен спрашивать сумму используя prompt и переводить эту суммы из валюты, написанной на кнопке в USD
 
+// Найдите замыкания. Для доступа к валютам из data.rates используйте[], .тут не поможет.Кнопки добавляйте в специальный контейнер(div например), созданный в HTML, или, на худой конец, в body
 
+{
 
+    fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
 
+        .then(data => {
 
+            const div = document.createElement('div')
 
+            document.body.append(div)
 
+
 
+            for (const [currency, value] of Object.entries(data.rates)) {
 
+                const btn = document.createElement('button')
 
+                btn.style.cssText = `
 
+                min-width: 50px;
 
+                margin: 0 5px 5px;
 
+                `
 
+                div.append(btn)
 
+                btn.innerText = `${currency}`
 
+                btn.onclick = () => {
 
+                    const summ = +prompt('Введите сумму в валюте кнопки')
 
+                    alert(`Это равно ${(summ / value).toFixed(2)} долларов`)
 
+                }
 
+            }
 
+            // console.log(data) //изучите структуру, получаемую с сервера в консоли
 
+        })
 
+}
 
+
 
+
 
+
 
+// closure calc 2
 
+{
 
+    // реализовано в файле HW09.html
 
+}
 
+
 
+
 
+
 
+// countries and cities
 
+{
 
+    // реализовано в файле HW09.html
 
+}