innerHTML vs createElement, createAttribute und createTextNode

[suit]

hallo,

ich hab folgendes script bzw funktion geschrieben und man muss dazu sagen, ich hab nicht viel ahnung von javascript ;):

  
function lib_toc() {  
 document.getElementById('toc').firstChild.appendChild(document.createElement('span'));  
 var lib_toc_button = document.getElementById('toc').firstChild.lastChild;  
  
 // lib_toc_button.innerHTML = ' [<a href="#" onclick="return false;">wegschalten</a>]';  
  
 lib_toc_button.appendChild(document.createTextNode(' ['));  
 lib_toc_button.appendChild(document.createElement('a'));  
 lib_toc_button.getElementsByTagName('a')[0].appendChild(document.createTextNode('wegschalten'));  
 var lib_toc_button_href = document.createAttribute("href");  
 var lib_toc_button_onclick = document.createAttribute("onclick");  
 lib_toc_button_href.nodeValue = '#';  
 lib_toc_button_onclick.nodeValue = 'return false';  
 lib_toc_button.getElementsByTagName('a')[0].setAttributeNode(lib_toc_button_href);  
 lib_toc_button.getElementsByTagName('a')[0].setAttributeNode(lib_toc_button_onclick);  
 lib_toc_button.appendChild(document.createTextNode(']'));  
}  

die frage nun:
beide scripte tun in sämtlichen relevanten browsern genau das, was ich möchte - welchen nachteil bietet die auskommentierte zeile mit innerHTML im vergleich zu den folgenden zeilen, die das selbe mittels dom-funktionen einfügen?

und natürlich die frage: mache ich das ganze unnötig kompliziert bzw gehts kürzer auch?

html-quelltext der seite ist übrigens xhtml 1.0 strict und wird als text/html ausgeliefert

hintergrund:
beim laden der seite soll diese funktion in ein element eine ein/ausblendefunktion einfügen - wer kein javascript hat, wird nicht durch diesen pseudo-link gestört und bekommt ihn garnicht erst

danke im voraus