我目前正在为我在学校的元素创建一个图片库。我遇到了一个问题，我不知道如何添加只显示在大预览图片下方而不是顶部小图片旁边的图片描述。每张小图都会有不同的描述。我自己尝试了一些东西，但我惨遭失败，我对这一切还是陌生的:)
这个问题有什么解决方案吗？
<head>
<title>Gallery</title>
<link href="galery.css" rel="stylesheet" type="text/css">
</head>
<body background="cosmic.jpg">
<div class="gallery" align="center">
<div class="smallpics">
<img onclick="getElementById('bigpic').src=this.src" id="picture1" src="images/picture1.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture2" src="images/picture2.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture3" src="images/picture3.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture4" src="images/picture4.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture5" src="images/picture5.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture6" src="images/picture6.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture7" src="images/picture7.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture8" src="images/picture8.png" />
<img onclick="getElementById('bigpic').src=this.src" id="picture9" src="images/picture9.png" />
</div>
<div class="bigpic" align="center">
<img id="bigpic" src="images/picture1.png" alt="" />
</div>
最佳答案
<div class="smallpics">
<img onclick="getElementById('bigpic').src=this.src; getElementById('bigpicDesc').innerHTML(this.alt) " id="picture1" src="images/picture1.png" alt="The Description" />
....
</div>
<div class="bigpic" align="center">
<img id="bigpic" src="images/picture1.png" alt="" />
<div id="bigpicDesc"> </div>
</div>
或
<div class="smallpics">
<img onclick="showInBig(this)" id="picture1" src="images/picture1.png" alt="The Description" />
....
</div>
<div class="bigpic" align="center">
<img id="bigpic" src="images/picture1.png" alt="" />
<div id="bigpicDesc"> </div>
</div>
function showInBig(element){
document.getElementById('bigpic').setAttribute('src',element.getAttribute('src'));
document.getElementById('bigpicDesc').innerHTML(element.element.getAttribute('alt'));
}
考虑到所有小图片都是描述。
关于javascript - 更改预览中的图片描述，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44045381/