|
@@ -0,0 +1,80 @@
|
|
|
+// //Города и страны
|
|
|
+fetch('https://raw.githubusercontent.com/russ666/all-countries-and-cities-json/master/countries.json')
|
|
|
+ .then(res => res.json())
|
|
|
+ .then(json => {
|
|
|
+ let countrySelect = document.querySelector('select');
|
|
|
+ let citySelect = document.createElement('select');
|
|
|
+
|
|
|
+ for(let countryChoice in json) {
|
|
|
+ let countrySelectOption = document.createElement('option');
|
|
|
+ countrySelectOption.innerText = countryChoice;
|
|
|
+ countrySelect.append(countrySelectOption);
|
|
|
+ }
|
|
|
+
|
|
|
+ countrySelect.onchange = () => {
|
|
|
+ let cityChoice = json[countrySelect.value];
|
|
|
+ citySelect.innerHTML = '';
|
|
|
+
|
|
|
+ for (let key in cityChoice) {
|
|
|
+ let citySelectOption = document.createElement('option');
|
|
|
+ citySelectOption.innerText = cityChoice[key];
|
|
|
+ citySelect.append(citySelectOption);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ document.body.append(countrySelect);
|
|
|
+ document.body.append(citySelect);
|
|
|
+ })
|
|
|
+
|
|
|
+// Таблица умножения
|
|
|
+let table = document.createElement('table');
|
|
|
+let caption = document.createElement('caption');
|
|
|
+
|
|
|
+for (let i = 0; i <= 9; i++) {
|
|
|
+ let row = document.createElement('tr');
|
|
|
+
|
|
|
+ for (let j = 0; j <= 9; j++) {
|
|
|
+ let col = document.createElement('td');
|
|
|
+ col.onmouseover = function() {
|
|
|
+ row.style.background = '#00BFFF';
|
|
|
+ col.style.background = '#FFDAB9';
|
|
|
+
|
|
|
+ for(let i = 0; i <= 9; i++) {
|
|
|
+ table.children[i].children[j].style.background = '#FFDAB9';
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ col.onmouseout = function() {
|
|
|
+ row.style.background = '';
|
|
|
+ col.style.background = '';
|
|
|
+ for(let i = 0; i < table.children.length; i++) {
|
|
|
+ table.children[i].children[j].style.background = '';
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ caption.onmouseover = function() {
|
|
|
+ caption.style.background = '#00BFFF';
|
|
|
+ caption.style.color = '#FFF';
|
|
|
+ }
|
|
|
+
|
|
|
+ caption.onmouseout = function() {
|
|
|
+ caption.style.background = '';
|
|
|
+ caption.style.color = '';
|
|
|
+ }
|
|
|
+
|
|
|
+ let val = i * j;
|
|
|
+ if (val === 0) {
|
|
|
+ val = i || j;
|
|
|
+ }
|
|
|
+
|
|
|
+ col.innerHTML = val;
|
|
|
+ row.appendChild(col);
|
|
|
+ table.appendChild(row);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (caption) {
|
|
|
+ table.appendChild(caption);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+document.body.appendChild(table);
|