gpt4 book ai didi

Javascript/Html/Css 来自两个 javascript 数组的随机背景图像和 Word

转载 作者:行者123 更新时间:2023-11-28 05:28:15 25 4
gpt4 key购买 nike

欢迎来到论坛!今天我想用 Javascript/html/css/php 语言编写一些代码,但遇到了一个问题。(我到处搜索这个问题,但没有结果。)

我的问题是 => 我的 js 文件中有两个数组。第一个存储目录中的图片,第二个存储我想通过 Math() 数字#indexes 随机选择的单词您可以阅读我的代码中的所有内容。我已经评论了他们。

window.onload = chooseGame;

var cGamePic = new Array("football.jpg","baseball.jpg");
var cGameName = new Array("football","baseball");
function chooseGame;
var rnd_num = Math.floor(Math.random() * cGamePic.length);
document.getElementById("comp1Game").src = cGamePic(rnd_num);
document.getElementById("??").?? = cGameName(rnd_num);
<!DOCTYPE html>
<html>
<head>
<title>Random pics</title>
<script src="rnd.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="container1">
<h1>Some text 1</h1>
<!--The next line will be displayed,but not randomly.
And I want it to the left-side of screen,as background image.
Like: the text "Some text 1" will be displayed in the random selected image.
(The some text 1 is selected randomly too,as "football")
-->
<img src="res/images/football.jpg" id="comp1Game" alt="Compare1">
</div>

<div id="container2">
<h1>Some text 2</h1>
<!-- The future container to see the 2nd selected image & word in it (right side of screen)
Like,if js select number 6,the word and image will be "baseball" and "baseball.jpg"
Shortly,I want to do it.
-->
</div>
</body>
</html>

最佳答案

使用 jQuery 更简单:

<!DOCTYPE html>
<html>
<head>
<title>Random pics</title>
<script src="rnd.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script>
var cGamePic = new Array("football.jpg","baseball.jpg");

$( document ).ready(function() {
chooseGame();
});

function chooseGame(){
var pic = cGamePic[Math.floor(Math.random()*cGamePic.length)];
var name = pic.replace(/^.*[\\\/]/, '');

$("#comp1Game").attr("src",pic);
$("#container1 h1").html(name);
}
</script>

</head>
<body>
<div id="container1">
<h1>Some text 1</h1>
<img src="res/images/football.jpg" id="comp1Game" alt="Compare1">
</div>
</body>
</html>

关于Javascript/Html/Css 来自两个 javascript 数组的随机背景图像和 Word,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38654836/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com