Código para que nos enlacen (sin JQuery)

Como muchos no usan JQuery, me han preguntado si es posible usar algo similar al código para que nos enlacen sin librerías o con cualquier librería, es decir, sólo con JavaScript.

Como la idea es muy simple y está muy bien armada, es fácil convertirla. Bastaría usar este otro script:

<script type='text/javascript'>
//<![CDATA[
function misBanners() {
lista = document.getElementById("listaBanners");
codigo = document.getElementById("codigoBanner");
ejemplo = document.getElementById("ejemploBanner");
var graphicFileName = lista.options[lista.selectedIndex].getAttribute("rel");
var newCode = '<a href="http://miBlog.blogspot.com/"><img src="' + graphicFileName + '" title="Agregar banner" alt="Agregar banner" /></a>';
codigo.value = newCode;
ejemplo.innerHTML = newCode;
}
//]]>
</script>

El código HTML es prácticamente igual, sólo agregamos el evento onChange en la etiqueta SELECT:

<form action="#" id="misBanners">
<div>
<span>Tamaño:</span>
<select onChange="misBanners();" name="listaBanners" id="listaBanners">
<option selected="selected" rel="URL_imagen_1">texto a mostrar</option>
<option rel="URL_imagen_2">texto a mostrar</option>
<option rel="URL_imagen_3">texto a mostrar</option>
<!-- seguimos agregando todas las imágenes que se nos de la gana -->
</select>
</div>
<div>
<span>Código:</span>
<textarea rows="10" cols="25" id="codigoBanner">&lt;a href="http://miBlog.blogspot.com/"&gt;&lt;img src="URL_imagen_1" title="nuestro texto" alt="nuestro texto" /&gt;&lt;/a&gt;</textarea>
<p>Copie y pegue el código en su sitio.</p>
</div>
</form>
<div id="ejemploBanner">
<a href="http://miSitio.blogspot.com/"><img src="URL_imagen_1" title="nuestro texto" alt="nuestro texto" /></a>
</div>