Покритикуйте говнокод01.04.2021 От: faq Из: Веб-строительство Dram 27 августа 2020, 14:49 174Учусь JS, вот такая задача.Дан следующий массив с работниками:let employees = [ {name: 'employee1', age: 30, salary: 400}, {name: 'employee2', age: 31, salary: 500}, {name: 'employee3', age: 32, salary: 600}, ];1. Выведите на экран каждого работника в своем теге li тега ul.2. Сделайте так, чтобы по клику li появлялся инпут для редактирования этого поля.Мое решение, есть серьезные ошибки, упущения? let employees = [ {name: 'employee1', age: 30, salary: 400}, {name: 'employee2', age: 31, salary: 500}, {name: 'employee3', age: 32, salary: 600}, ]; let body = document.querySelector('body'); let ul = document.createElement('ul'); body.appendChild(ul); for (let i =0; i < employees.length; i++){ let lii = document.createElement('li'); lii.innerText = employees[i]['name'] + ' '+ employees[i]['age'] + ' '+ employees[i]['salary']; ul.appendChild(lii); function eventLI () { lii.addEventListener("click", function fn (){ let input = document.createElement('input'); input.value = this.innerText; this.innerText = ''; this.appendChild(input); lii.removeEventListener("click", fn) input.addEventListener("blur", function (){ lii.innerText = input.value; input.remove(); eventLI (); }) }) } eventLI (); } Сергей 27 августа 2020, 15:02<html><head><title>js test</title><script>window.onload = function(){let employees = [ {name: 'employee1', age: 30, salary: 400}, {name: 'employee2', age: 31, salary: 500}, {name: 'employee3', age: 32, salary: 600},];let body = document.querySelector('body');let ul = document.createElement('ul');document.getElementsByTagName('body')[0].appendChild(ul);for (let i =0; i < employees.length; i++){ let lii = document.createElement('li'); lii.innerText = employees[i]['name'] + ' '+ employees[i]['age'] + ' '+ employees[i]['salary']; ul.appendChild(lii); function eventLI () { lii.addEventListener("click", function fn (){ let input = document.createElement('input'); input.value = this.innerText; this.innerText=""; this.appendChild(input); lii.removeEventListener("click", fn) input.addEventListener("blur", function (){ lii.innerText = input.value; input.remove(); eventLI (); }) }) } eventLI ();}}</script></head><body></body></html>Работает и славно 😀 Amigo_9876 27 августа 2020, 15:52employees.forEach(function(item, i, arr){ $('.emp').append('<li>' + employees[i].name + ', ' + employees[i].age + ', ' + employees[i].salary + '</li>');})Только Jquery подключить надо. for i — это уже прошлый век. Dram 27 августа 2020, 16:08 Amigo_9876 #:JqueryЯ ведь чистый JS учу, так что критика не принимается )) Snake800 27 августа 2020, 16:27 Шикарно 👍. eventLI я бы вынес из цикла в отдельный метод, в качестве параметра принимающий lii. silicoid 27 августа 2020, 18:01 Как уже сказали выше, код лучше побить на логически-разделенные методы, чтоб было проще в нем ковыряться. В остальном, вроде всё норм. Похожие записи:Программа REPL базы данных компании на Rust для главы 8 книги Поместите каждый объект в указанное ведро Веб-приложение калькулятора BMR, написанное на HTML / CSS / Vanilla JS СУХОЙ контроль ввода в Python Панель навигации по сайту
Dram
Учусь JS, вот такая задача.
Дан следующий массив с работниками:
1. Выведите на экран каждого работника в своем теге li тега ul.
2. Сделайте так, чтобы по клику li появлялся инпут для редактирования этого поля.
Мое решение, есть серьезные ошибки, упущения?
Сергей
Работает и славно 😀
Amigo_9876
Только Jquery подключить надо. for i — это уже прошлый век.
Dram
Jquery
Я ведь чистый JS учу, так что критика не принимается ))
Snake800
silicoid