javascript - 尝试使用数据库显示图像 HTML

Question

我正在尝试为动物收容所创建动物数据库。到目前为止，我拥有的是一组包含动物物种的表格，当用户选择物种时，它会显示所有可用的动物。现在我希望用户单击所选的动物，然后将显示有关该动物的更多详细信息，例如位置、性别、大小。问题是，我对 Javascript/HTML 知之甚少，并且遇到了很多问题。其中之一是在第三个屏幕中显示更多细节的图像。到目前为止我对 HTML 的了解是:

<div class="row" style="text-align: center">
<img src="foto_animal" height="180">
</div>

“foto_animal”是表“Animal”中保存图像 URL 的列。我应该用 Javascript 更改什么吗？还是只是 HTML 问题？提前致谢。

编辑

我成功获取了 URL，这是 script.js 文件

var populateContact = function(data) {
$('#contact_photo').text(data.foto_animal); 

这是index.html

<h2><span id="contact_photo"></h2>

它显示了 URL，但现在我希望它被识别为图像。

Answer 1

编辑:要让您的用户按照评论中的要求下载，请尝试添加标签并设置其下载属性。

这是一个example .

<小时/>

通过html，引用src中的图像时<img>的属性(property)标签，添加图像文件的文件扩展名

假设您的 foto_animal 是 jpeg 文件并且与 html 文件位于同一位置，

<img id='myImg' src="foto_animal.jpg" height=180px>

通过 JavaScript， 您只需使用 document.getElementByID 调用该元素并设置 .src 属性

document.getElementById("myImg").src = "foto_animal.jpg";

通过jquery， 只需使用 .attr 属性来设置标签 ID 的 src

$("#myImg").attr('src', 'foto_animal.jpg');