Druga linijka wywołuje wyjątek. Widocznie nie można tworzyć referencji do funkcji. Powyższy kod dodaje fragment formularza w HTML-u, a dokładniej strony artykułu. Można to zrobić na 3 sposoby:
var add = function() { var c = document.createElement, tb = c('tbody'), tr = c('tr'), th = c('th'), tR = c('tr'), td = c('td'), ta = c('textarea'), fs = c('fieldset'), le = c('legend'), o1 = c('input'), o2 = c('input'), o3 = c('input'), l1 = c('label'), l2 = c('label'), l3 = c('label'); th.colspan = 2; th.innerHTML = '{lang.page} '+ ++num; td.colspan = 2; td.align = 'center'; ta.name = 'txt[]'; ta.cols = 50; ta.rows = 25; ta.style.width = '100%'; le.innerHTML = '{lang.opt}'; o1.type = o2.type = o3.type = 'checkbox'; o1.name = 'emo[]'; o2.name = 'br[]'; o3.name = 'code[]'; l1.appendChild(o1); l1.appendChild(document.createTextNode(' {lang.emo}')); l2.appendChild(o2); l2.appendChild(document.createTextNode(' {lang.br}')); l3.appendChild(o3); l3.appendChild(document.createTextNode(' {lang.hl}')); fs.appendChild(l1); fs.appendChild(l2); fs.appendChild(l3); td.appendChild(ta); td.appendChild(fs); tR.appendChild(td); tr.appendChild(th); tb.appendChild(tr); tb.appendChild(tR); tab.insertBefore(tb, tab.tFoot); }; add();
1) tak jak powyżej - generować wszystko z pomocą JS
2) dopisać dodatkowy HTML i go kopiować
3) wziąć istniejący fragment HTML i go kopiować
W przypadku 2) i 3) i tak trzeba zmodyfikować co najmniej 2 elementy w istniejącym kodzie, czyli:
1) numer nowej strony (jeżeli poprzedni był 2, to będzie 3)
2) usunąć zawartość <textarea>
3) ewentualnie zmienić zawartość opcji (checkboxów)
Zatem trzeba znów kopać w drzewku (getElementsByTagName). Metoda 1) jest niestety dłuższa, bo wszystko tworzymy za pomocą funkcji DOM. Jeżeli zmienimy strukturę formularza w kodzie HTML, trzeba dostosować kod JavaScript.
Niedługo może wprowadzę zakładki (tabs), zatem jak najlepiej to rozwiązać?