createElement VS innerHTML
Здравствуйте Уважаемые форумчане.
Вкратце, у меня имеется ID а именно document.getElementById("container") И мне нужно создать форму на лету с разными полями. Так вот, как лучше, создать форму и поля при помощи createElement и затем вставить их в ID container или же готовую форму вставить через document.getElementById("container").innerHTML = ""? Какой способ будет работать быстрее и какой целесообразнее. Заранее спасибо! |
innerHTML
|
Вообще, если форма большая - она должна прилетать с сервера. А если на пару элементов - то createElement удобнее.
В целом innerHTML работает быстрее, но если у вас возникла необходимость его использовать для чего-то большего, нежели вставки текста - скорее всего что-то вы делаете не так. |
По-моему разница в скорости тут несущественна. Потому как если форма нарисуется не за 100 ms, а за 200 ms - разницы Вы не заметите.
Существует несколько критериев при выборе того или иного подхода. В частности, когда надо сделать адаптивную верстку и обеспечить кроссбраузерность. Я сталкивался с ситуациями, когда в innerHTML не пропишешь все вариации, используя CSS, либо CSS становится монстрообразным. В этом случае лучше создавать форму поэлементно на javscript, используя проверки "if/else". Все критерии описывать не буду. Скеажу лишь о том, что мне нравится. При использованиии var myobject = createElement() мы сразу получаем указатель на объекты (myobject), с которыми дальше можно работать, а при использовании innerHTML Вам потом придется каждый раз делать getElementById(). И если элементов на странице много, то как раз здесь и возможно будет заметно замедление работы. |
Маэстро,
Если уж речь идет окакой-то большой форме с логикой создания то проще уж пользоваться шаблонизаторами. Например я пользую underscorejs, очень удобно. |
Я соглашусь с Маэстро. Зачастую требуется на созданные элементы навешивать обработчики событий и при createElement это делать гораздо проще.
Добавлю только, что если форма большая, то имеет смысл вставлять фрагментом, а не поэлементно |
Складывается впечатление что это разные способы создания элементов/страницыHTML и у них есть свои достоинства и недостатки
|
Вы прикалываетесь чтоли, какой createElement?! В 99% случаях поля ввода завернуты во всякие label и другие обертки, что их тоже все создавать? А если верстальщику захочется что-нибудь поменять?
Шаблонизатору скармливаются параметры, в ответ получают HTML-код, который вставляется через innerHTML... |
Aetae, У меня JS подключается динамически поэтому по факту и форма грузится с сервера.
Что Вы подразумеваете под тем, что если форма небольшая то и createElement'ом можно обойтись? Просто я не совсем понял разницу между большой и маленькой, по сути то принцип один. |
Маэстро,
Я понял Вашу мысль, спасибо! |
Часовой пояс GMT +3, время: 16:36. |