我这里有这段代码，每天都会显示一个新图像。它有效，但单击按钮后仅显示图像。页面上的其余文本消失。有没有办法可以在页面上同时显示照片和文本？
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<h1>Want to see a picture?</h1>
<h2>Picture Display</h2>
</p><p>Some Text Here Some Text Here Some Text Here Some Text Here</p>
<button onclick="loadList()">Click Here!</button>
<script type="text/javascript"><!--
var imlocation = "images/";
function ImageArray (n) {
this.length = n;
for (var i =1; i <= n; i++) {
this[i] = ' '
}
}
image = new ImageArray(90);
image[0] = 'CPR1.jpg';
image[1] = 'CPR2.jpg';
image[2] = 'CPR3.jpg';
var currentdate = new Date();
var imagenumber = currentdate.getDay();
function loadList() {
document.write('<img src="' + imlocation + image[imagenumber] +
'">');
style.display = "none";
}
//--></script>
</body>
</html>
最佳答案
document.write主要用于测试:如果在 HTML 文档完全加载后使用，它将删除所有现有的 HTML。
您可以使用innerHTML附加图像标签
var imlocation = "images/";
function ImageArray(n) {
this.length = n;
for (var i = 1; i <= n; i++) {
this[i] = ' '
}
}
image = new ImageArray(90);
image[0] = 'CPR1.jpg';
image[1] = 'CPR2.jpg';
image[2] = 'CPR3.jpg';
var currentdate = new Date();
var imagenumber = currentdate.getDay();
function loadList() {
document.getElementById('insertPicture').innerHTML=('<img src="' + imlocation + image[imagenumber] +
'">');
}<h1>Want to see a picture?</h1>
<h2 id='insertPicture'>Picture Display</h2>
<p>Some Text Here Some Text Here Some Text Here Some Text Here</p>
<button onclick="loadList()">Click Here!</button>关于javascript - 单击按钮 Javascript 后仅显示图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43896973/