JavaScript es uno de los lenguajes de programación más utilizados en el desarrollo Web moderno y comprender sus características es fundamental para los desarrolladores Web que utilizan sus características día a día.
Mediante JavaScript es posible obtener y mostrar contenidos random (aleatorio) de un JSON. Esto se puede lograr empleando Math.floor()
junto con Math.random()
, como podemos ver en el siguiente código:
<!DOCTYPE html> <html> <head> <script> var imagenes = [ { img: "image1.png", text: "Example 1"}, { img: "image2.png", text: "Example 2"}, { img: "image3.png", text: "Example 3"} ]; window.addEventListener("load", function load(){ var i = Math.floor(Math.random()*imagenes.length); document.getElementById("box").innerHTML = "<img src='img/" + imagenes[i].img+ "' alt='" + imagenes[i].text+ "' /><p>" + imagenes[i].text + "</p>"; },false); </script> </head> <body> <div id="box"></div> </body> </html>
Más sobre Diseño y desarrollo Web
Hola amigo, como puedo poner un enlace segun la imagen. gracias
Hola!
Respecto a tu consulta, en la estructura del JSON deberían tener un key más para el link. Por ejemplo, se podría llamar link, y a ese key le asignas el enlace en cada registro en el JSON.
Luego, cuando se hace el random, habría que usar la etiqueta a y en el href ubicar imagenes[i].link
Espero que te sea útil.
Saludos
que es un json
JSON es el acrónimo de JavaScript Object Notation. Es un formato para compartir datos en Internet.
Hola amigo,eh dísculpe será que me puede ayudar, necesito que me explique o me de algunos consejos, sobre cómo hacer que un objeto salté,así como Mario bros,hacer que un sprite salte y que el fondo se mueva.
Tengo algunos conocimientos básicos de HTML,CSS y javascript pero más en HTML y css entonces será que me puedes ayudar?
Porque estoy totalmente dedicado al desarrollo web y más en desarrollo de juegos.
Por favor necesito su ayuda.
Hola, si es algo interactivo, te recomiendo utilizar Canvas.
Te dejo un link donde está explicado como comenzar un juego y mover una nave: https://damiandeluca.com.ar/mi-primer-videojuego-con-html5-canvas-y-javascript
No tiene la parte de salto, pero vas a ver como se mueve un elemento (una imagen) en pantalla.
Espero te sea útil
Saludos