При нажатии на ссылку рядом с ней должно появляться поле ввода, которое создается с помощью js. Возник вопрос: как желательнее делать - 1-ым методом (через DOM), или вторым (через innerHTML)? И что будет быстрее работать?
1-ый метод:
var Elem = {
setAttrs : function(elem, attrs){
for(var a in attrs){
elem.setAttribute(a, attrs[a]);
}
},
newElem : function(elem, attrs){
var el = document.createElement(elem);
Elem.setAttrs(el, attrs);
return el;
},
newTxt : function(elem, txt){
elem.appendChild(document.createTextNode(txt));
}
}
var prompt = Elem.newElem('table', {class:'std_form', id:'quickreply'});
prompt.innerHTML = "<tr><td></td><td></td></tr> <tr><td></td><td></td></tr> <tr><td></td><td></td></tr> <tr><td colspan=\"2\"></td></tr> <tr><td></td><td></td></tr> <tr><td></td><td></td></tr>";
var name = Elem.newElem('input',{type : 'text', name : 'name', id : 'name', size:'30', value : "asdasd"});
var subj = Elem.newElem('input', {type : 'text', name : 'subject', id : 'subj', size:'30', value : "фывыфв");
var txtarea = Elem.newElem('textarea', {wrap : 'virtual', name : 'message', id : 'quickreplytxt', cols:'60', rows:'10'});
var submit = Elem.newElem('input', {type : 'submit', value: 'Отправить'});
Elem.newTxt(prompt.cells[0], "Имя: ");
Elem.newTxt(prompt.cells[4], "Тема комментария: ");
prompt.getElementsByTagName('td')[1].appendChild(name);
prompt.getElementsByTagName('td')[5].appendChild(subj);
prompt.getElementsByTagName('td')[6].appendChild(txtarea);
prompt.getElementsByTagName('td')[10].appendChild(submit);
elem.appendChild(prompt);
txtarea.focus();
2-ой метод:
var prompt = document.createElement('table');
prompt.innerHTML = "<tr><td>Имя:</td><td><input type=\"text\" name=\"name\" id=\"name\" /></td></tr><tr><td>Тема: </td><td><input type=\"text\" name=\"subject\" id=\"subj\" /></td></tr><tr><td><textarea wrap=\"virtual\" name=\"message\" id=\"quickreplytxt\" cols=\"60\" rows=\"10\"></textarea></td></tr><tr><td></td><td><input type=\"submit\" value=\"Отправить\" /></td></tr>";