Генерация HTML-форм с помощью Javascript

Question

Мое приложение использует JavaScript для генерации всего HTML-кода для моего сайта. Index.html в основном содержит

<div id="menu"></div><div id="content/><div id="content2/>

И javascript заменяет div. Я обнаружил, что выполняю много повторяющихся задач, когда мне нужно создать форму.

var html = "<form id="form1"> ... </form>";

Есть ли хороший фреймворк для генерации HTML-форм, чтобы вы могли сделать что-то вроде

generateForm(<formId>, [{name: "field1", type: button}, {name: "field2", type: input}]);

или что-то похожее?

Answer 1

Вы можете упростить генерацию, используя такие фреймворки, как MooTools, jQuery и т.д ...

Для создания формы вам нужно что-то вроде этого (в MooTools ):

var form = new Element('form', { 'id' : 'myFormId', 'class' : 'myFormClass', ... });
var btn = new Element('input', { 'type' : 'button' , ... })
form.inject(btn);

Вы можете заключить эту логику в некоторые методы для централизации генерации кода

Answer 2

Вы можете также попробовать шаблонизатор, как PURE
Определите HTML-коды, а затем создайте их на основе данных JSON.

Answer 3

Я написал проект, который создал таблицу tr и td, используя javascript:

objTR = document.createElement ("TR");
objTR.setAttribute ("id", "factor_row_" + id);

objTD = document.createElement ("TD");
objDIV = document.createElement ("DIV");

objDIV.setAttribute ("id", "title_" + id);
objDIV.innerHTML = title;
objTD.appendChild (objDIV);
objTR.appendChild (objTD);

Я думаю, что appendChild будет работать для вас. Вы должны просто создать свой элемент формы и его атрибуты, а затем добавить его к родительскому элементу. Надеюсь, это поможет вам;)