英文:
Why isn't the image displaying in my JavaScript code?
问题
我把图片添加到了imageshown文件夹,但仍然无法在网页上查看图片。
亲爱的朋友们,请帮助我,我根据显示的汽车添加了条件来显示图片,但即使尝试了我在这里找到的其他方法,它也不起作用。
<img id='img' src=imageshown>
我想要看到一张图片,但图片就是不显示,如何修复这个问题,有人可以帮忙吗!
英文:
i added the image in the imageshown folder and still im unable to view the image on the webpage.
help me my dear friends i added conditions to display image according to the car shown.but it doesnt work even after trying other ways to which i found here.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
/* this is an event */
//alert('Im Annoying');
var username = prompt("Enter Your Name");
var car = ["Bmw", "Mercedes", "Koenigsegg"];
var randomNumber = Math.floor(Math.random() * car.length);
var randcar = car[randomNumber]
if (username === "Nilesh") {
document.write("<h1>Hello " + username + " you won a " + randcar + "!</h1>");
if (randcar === "Bmw") {
var imageshown = "Koenigsegg.jpg"
} else if (randcar === "Mercedes") {
var imageshown = "Koenigsegg.jpg"
} else {
var imageshown = "Koenigsegg.jpg"
}
} else if (username === "Chris") {
document.write("<h2>Hey " + username + " You Won A " + randcar + "!</h2>");
if (randcar === "Bmw") {
var imageshown = "Koenigsegg.jpg"
} else if (randcar === "Mercedes") {
var imageshown = "Koenigsegg.jpg"
} else {
var imageshown = "Koenigsegg.jpg"
}
} else {
document.write("<h3>" + username + " Go Cry On Your Mom's Lap 🤣!</h3>");
var imageshown = "Koenigsegg.jpg"
}
document.getElementById('img').src = imageshown;
<!-- language: lang-css -->
/* Basic CSS comment */
body {
background: beige;
color: white;
width: 960px;
margin: 0 auto;
font-size: 30px;
}
h1 {
font-size: 80px;
color: #333;
}
h2 {
font-size: 80px;
color: #a61250;
}
h3 {
font-size: 80px;
color: #7d1db5;
}
<!-- language: lang-html -->
<img id='img' src=imageshown>
<!-- end snippet -->
i wanted to see an image but the image just doesnt show how to fix this someone help!!
答案1
得分: 0
Your code to show the image is correct. However, your sequence is wrong as you know code run from top to bottom.
Your current code loads the JavaScript code first, then it loads the element of the <img>
.
To fix this, move <script>
to the bottom of your body.
英文:
Your code to show the image is correct. However, your sequence is wrong as you know code run from top to bottom.
Your current code loads the the javascript code first then it loads the element of the <img>
To fix this, move<script>
to the bottom of your body.
<!DOCTYPE html>
<html>
<head>
<title>Week 1 of learning java script.</title>
<style>
/* Basic CSS comment */
body {
background: beige;
color: white;
width: 960px;
margin: 0 auto;
font-size: 30px;
}
h1 {
font-size: 80px;
color: #333;
}
h2 {
font-size: 80px;
color: #a61250;
}
h3 {
font-size: 80px;
color: #7d1db5;
}
</style>
</head>
<body>
<img id='imgss' src="" >
<script>
/* this is an event */
//alert('Im Annoying');
var username = prompt("Enter Your Name");
var car = ["Bmw", "Mercedes", "Koenigsegg"];
var randomNumber = Math.floor(Math.random() * car.length);
var randcar = car[randomNumber]
if (username === "Nilesh") {
document.write("<h1>Hello " + username + " you won a " + randcar + "!</h1>");
if (randcar === "Bmw") {
var imageshown = "oldlogo.jpg"
}
else if (randcar === "Mercedes") {
var imageshown = "oldlogo.jpg"
}
else {
var imageshown = "oldlogo.jpg"
}
}
else if (username === "Chris") {
document.write("<h2>Hey " + username + " You Won A " + randcar + "!</h2>");
if (randcar === "Bmw") {
var imageshown = "oldlogo.jpg"
}
else if (randcar === "Mercedes") {
var imageshown = "oldlogo.jpg"
}
else {
var imageshown = "oldlogo.jpg"
}
}
else {
document.write("<h3>" + username + " Go Cry On Your Mom's Lap 🤣!</h3>");
var imageshown = "oldlogo.jpg"
}
document.getElementById('imgss').src = 'oldlogo.jpg';
</script>
</body>
</html>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论