Redagavimas elementų grupėje su JavaScript

Tarkime, kad dabar turime ne vieną pastraipą, o daug:

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

Padarykime taip, kad paspaudus bet kurią pastraipą joje atsirastų įvesties laukas redagavimui.

Tiesą sakant, ši užduotis mums nėra sudėtinga, nes beveik visas kodas buvo gautas mums ankstesnėje pamokoje.

Norėdami išspręsti mūsų užduotį, tiesiog paleiskime ciklą per pastraipas ir cikle naudokime kodą iš ankstesnės pamokos (šio kodo net nereikės keisti):

javascriptlet 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);
  });
}