⊗jsPmPrEGE 476 of 502 menu

Editing in a group of elements in JavaScript

Let now we have not single paragraph, but many:

<p>text1</p> <p>text2</p> <p>text3</p>

Let's make it so that when you click on any paragraph, an input for editing appears in it.

In fact, such a task is not difficult for us, since almost all the code was obtained by us in the previous lesson.

To solve our problem, we simply run a loop through paragraphs and use the code from the previous lesson in the loop (this code doesn't even need to be changed):

let elems = document.querySelectorAll('p'); for (let elem of elems) { elem.addEventListener('click', function func() { let input = document.createElement('input'); input.value = elem.textContent; elem.textContent = ''; elem.appendChild(input); input.addEventListener('blur', function() { elem.textContent = this.value; elem.addEventListener('click', func); }); elem.removeEventListener('click', func); }); }

The ul tag is given. Make it so that by clicking on any li an input appears in it, using it you can edit the text of this li.

Given an HTML table. Make it so that when you click on any cell in it, an input appears for editing the text of this cell.

enru