sábado, 17 de noviembre de 2007

Random

Como podéis comprobar los que visitáis mi página, no tengo ni idea de HTML XD, así que no sé hasta qué punto deberiáis hacerme caso con esto XD, pero el caso es que he conseguido poner un módulo de este tipo que funciona, basado en la generación de números aleatorios (random) para hacer que aparezca un código HTML variable cada vez que entramos en nuestra página.

La idea es que tenemos un código HTML con una estructura bien definida, dependiente de un parámetro que queremos que cambie cada vez que actualicemos la página (por ejemplo, el código podría ser el de colocar una imagen, y la variable es la dirección de la imagen que queremos que aparezca). Simbólicamente, vamos a denotarlo así:

Colocar_Imagen(x)

El procedimiento es sencillo: se crea un vector cuyas componentes sean los valores que puede tomar nuestra x (por ejemplo, las direcciones de las fotografías que queramos colocar en nuestra página). Después se define una variable aleatoria que indique la componente del vector que vayamos a usar. Y por último, se escribe el código con esta componente, que al depender de una variable aleatoria, es también aleatoria.

El código sería algo así:

<script language="JavaScript">

function rndm(){

var x=new Array()

x[1]="direccion1.jpg"

x[2]="direccion2.jpg"

var i=Math.floor(Math.random()*(x.length-1))


document.write('Colocar_Imagen('+x[i+1]+')')

}


rndm()

</script>


Donde:

Colocar_Imagen('+x[i+1]+')

Significa que la parte del código que tenga que variar, a la que hemos llamado x, se sustituya exactamente por '+x[i+1]+', que ahora es una variable aleatoria.

Lo de sumarle "+1" al índice es debido a que queremos que los valores sean equiprobables, y el random genera un valor entre 0 y 1 mientras que el vector no tiene componente x[0], sino que empieza en x[1]. Así que si multiplicamos el valor del random por "n-1" (donde "n" es el número de componentes de x) obtenemos números aleatorios entre 0 y n-1. Si ahora le sumamos una unidad a todos los índices, en realidad tenemos números aleatorios entre 1 y n, que es exactamente lo que queremos.

El resultado no puedo mostrarlo aquí, puesto que Blogger parece no permitir la ejecucción de scripts Java dentro de las entradas de blog, pero podéis copiar el siguiente ejemplo de código HTML y veréis qué bien funciona ;)! (aparece en la columna de la derecha de esta página bajo el nombre de "Chicas guapas").

<script language="JavaScript">

function rndm(){

var x=new Array()

x[1]="http://static.flickr.com/28/45399088_5767116d5e.jpg"

x[2]="http://img143.imageshack.us/img143/6605/viciousna3.jpg"

var n=new Array()

n[1]="Katie Fey"

n[2]="Liz Vicious"

var i=Math.floor(Math.random()*(x.length-1))


document.write('<img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 200px;" src="'+x[i+1]+'" alt="Foto" border="0" /> <br> '+n[i+1]+'')

}


rndm()

</script>


Nota: Para que el código pueda aparecer como texto en una entrada, en vez de ejecutarse como código HTML, hay que cambiar los signos "<" (menor que) por "& l t ;" y ">" (mayor que) por "& g t ;" (sin los espacios que he puesto entre las letras, que son sólo para que no los vuelva a convertir en signos de > ó <). Así que si se copia el código anterior, habrá que hacer el cambio inverso para que salga lo que aparece escrito en la entrada.

No hay comentarios:

Publicar un comentario

Querido astarothista!,

Si te ha gustado la entrada y quieres dejar constancia de ello, tienes alguna sugerencia para completarla o corregirla, quieres mostrar tu opinión respecto a algo de lo que se haya hablado en esta entrada (con respeto) o simplemente quieres dejarme un mensaje a mi o a la comunidad, no dudes en comentar ;)!

Recuerda que también estamos en Facebook y en Google+.