Прервый метод (DOM) - это программирование. Второй (HTML) - это "разметка текста". Лично я склоняюсь к программированию!
При небольших количествах элементов на странице оба способа практически эквивалентны. Причем способ с innerHTML иногда выглядит читабельнее; и его можно быстрее написать.
Однако, на больших количествах элементов появляется разница.
Можете попробовать нарисовать таблицу 100 строк х 100 столбцов. По моим оценкам var o=getElementById (с которым прийдется работать при innerHTML ) работает заметно медленнее, чем прямое указание javascript объекта var o=someobject
var someobject = document.createElement('div');
Особенно торможение заметно в IE.
Хотя теоретически по скорости должны работать одинаково.
Поэтому лучше DOM. Но... существует ряд проблем, которые без innerHTML не решишь.
Например, Вы хотите создать форму с элементом "input" типа "file":
var f=document.createElement('form');
f.method='POST';
f.action='lalala.php';
f.enctype='multipart/form-data';
... ...
Это работать не будет в IE. У него глюк с enctype.
Как быть? - Только вот так:
o.innerHTML='<form enctype="multipart/form-data"></form>';
... ...