Como crear el link «ir al principio» con JQuery

Hola,  vamos a ver como mediante la insercion de contenido HTML podemos crear los links que muchas veces en las páginas que permite que nos desplazemos la inicio de la página.

En el ejemplo tenemos varios párrafos con texto referente a Entity Framework que he sacado de MSDN, la idea es que después de cada párrafo vamos a tener un link para ir al inicio de documento, sería muy fácil crear manualmente varias etiquetas a luego de finalizar cada página, pero vamos a estar repitiendo código y más aún, si necesitamos implementar esta funcionalidad en 10 párrafos y en diferentes páginas el tiempo que gastariamos se incrementaria bastante.

Para solucionar el anterior problema, vamos a usar la siguiente función JQuery:

    
$(function(){
            $('<a id="top" name="top"></a>').prependTo('body');
            $('<a href="#top" style="font-size:12px;">Ir al principio</a>').insertAfter('#divContenido p');
        });

En la primera línea simplemente agregasmo un div al inicio del documento y en la segunda línea añadimos una etiqueta a con su propiedad href al id del div insertado anteriormente luego de cada párrafo dentro del div con el id igual a divContenido.

Y eso es todo, como pueden ver con tan solo 2 líneas de codigo hemos añanido la funcionalidad de ir al principio en nuestro documento.

Descarga el ejemplo !!