1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- // //Города и страны
- 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);
|