La capacidad de JavaScript para acceder al DOM ( Document Object Model) de una página Web ofrece a los desarrolladores web de los medios para cambiar dinámicamente los atributos de cualquier elemento HTML (Hypertext Markup Language) . El método getElementById JavaScript () permite al programador cambiar el ancho de una etiqueta
, altura, fronteras e incluso el "src ", o la propiedad origen de la imagen . Las imágenes se pueden cambiar al azar o secuencialmente . La etiqueta
debe estar marcado con un identificador antes el método getElementById () se puede acceder a él. Timing Banner Imagen Cambia setInterval
de JavaScript ( ) función provoca eventos después de un período de tiempo determinado transcurrido, y seguirá para lanzar el evento a menos que sea detenido por el método clearInterval (). SetInterval ( ) toma dos parámetros : la función que desea ejecutar y la cantidad de tiempo que debe transcurrir antes de ejecutarlo. Usted puede tener setInterval () llama a un script que hace girar la fuente de imagen de banner cada pocos segundos o al azar. El programa de código siguiente llama a una función que cambia la bandera cada cinco segundos
Messenger language="javascript">
setInterval ( " changeAdBanner ()" , 5000) ; . < Br >
< /script>
Acceso a la etiqueta de imagen a través del DOM
la función JavaScript llama " getElementById ()" y " getElementsByName ()" puede acceder y manipular la página web DOM. " GetElementById ()" puede llegar a los elementos HTML directamente . Por otro lado , " getElementsByName ()" almacena todos los elementos del mismo nombre en la página Web en una matriz. Para cambiar una etiqueta específica , por ejemplo , se le debe dar una clase única o nombre de identificación. Desde cada banner puede ser representado por su propio ID , el " getElementById (): es el método más fácil de usar La siguiente declaración accederá una etiqueta con el ID . " Ad " y cambie su fuente de imagen a" banner2 . . jpg "
document.getElementById ( " ad " ) banner2.jpg " src = ". ;
Random Banner rotación de la imagen
< p > Sus banderas puede ser programado para cambiar de forma aleatoria en lugar de secuencialmente . La función de JavaScript Math.random ( ) genera un número aleatorio entre 0 y 1 . multiplicar este número por 3 produce un número aleatorio que oscila entre 0 y 3 . La Matemáticas funciones. piso () redondea el número a un entero . Finalmente , añadiendo un 1 al resultado limita el conjunto de los números de 1 , 2 ó 3. la siguiente función sustituye al azar uno de tres imágenes almacenadas en una matriz que se llama publicidad .
changeAd function () {
NextBannerImage = 1 + Math.floor ( Math.random () * 3 ) ;
document.getElementById ( "ad" ) . src = anuncios [ NextBannerImage ] ; .
}
secuencial Banner rotación de la imagen
sus banderas también se pueden programar para cambiar secuencialmente Si usted tiene una serie de tres imágenes de banner , puede crear un script para mostrar el primer , segundo y tercer elemento de la matriz , a continuación, iniciar el conteo más . Cada vez que el changeAd () de abajo se llama , un 1 se agrega a la barra " NextBannerImage "y la siguiente imagen de la matriz se hizo la fuente . una vez que la cuenta llegue a 3 , el contador se pone a 0 . Utilice la función setInterval () para llamar a este después de un intervalo de tiempo establecido .
NextBannerImage var = 0 ; //variable global accesible a la función
changeAdBanner función () {
NextBannerImage + + ;
document.getElementById . ( "ad" ) src = anuncios [ NextBannerImage ] ;
if ( NextBannerImage == 3 ) {
NextBannerImage = 0 ;
}
}