├── index.html └── src ├── css └── style.css └── js └── index.js /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 7 | 8 | HW5-DOM 9 | 11 | 12 | 13 | 14 |
15 |
16 |
17 |
18 |
19 | 23 |
24 |
25 | 29 |
30 | 31 |
32 |
33 | Not registered? Create an account 34 |
35 |
36 |

37 |     
38 |
39 | 40 | 41 | -------------------------------------------------------------------------------- /src/css/style.css: -------------------------------------------------------------------------------- 1 | .auth { 2 | height: 100vh; 3 | } 4 | .auth-wrap { 5 | width: 365px; 6 | box-shadow: 1px 5px 17px 0 #5f5c5c; 7 | } -------------------------------------------------------------------------------- /src/js/index.js: -------------------------------------------------------------------------------- 1 | window.addEventListener( 'load', function () { 2 | let data = {}; 3 | function saveData() { 4 | const dataFromForm = new FormData(loginForm); 5 | dataFromForm.forEach((el, key) => { 6 | data[key] = el; 7 | }) 8 | printAndSaveData() 9 | } 10 | 11 | function printAndSaveData() { 12 | const result = document.querySelector('.result') 13 | if (result) { 14 | result.textContent = JSON.stringify(data,undefined, 2) 15 | } 16 | localStorage.setItem('auth-data',JSON.stringify(data)) 17 | } 18 | 19 | const loginForm = document.getElementById('loginForm'); 20 | loginForm.addEventListener("submit", function (event) { 21 | event.preventDefault(); 22 | 23 | saveData(); 24 | }); 25 | }); --------------------------------------------------------------------------------