如何使用 jquery 将图像显示到 html 文件？ （一些 php 和 xml）

Question

我有一个名为“ LaptopsImages ”的图像文件夹。

在我的名为 notebooks.php 的文件中，我有一个包含不同笔记本电脑的数组列表，其中包含以下变量：标题、品牌、价格、描述、规格和图片名称。 我的数组列表转换为 XML DOM 树。

在名为 product.html 的文件中，我编写了一个代码，将每个产品数据放入变量中并显示出来：

var title = $theProduct.find('title').text();
var brand = $theProduct.find('brand').text();
var price = $theProduct.find('price').text();
var description = $theProduct.find('description').text();
var spec = $theProduct.find('spec');
var imageFilename = $theProduct.find('picture').text();

document.getElementById("title").innerHTML=title
document.getElementById("brand").innerHTML=brand
document.getElementById("price").innerHTML=price                        
document.getElementById("description").innerHTML=description
document.getElementById("spec").innerHTML=description

我已经完成了将每个产品数据显示到我的 html 中，除了每台笔记本电脑的图片。 有什么办法可以用我的变量中已有的名称显示图片？ 假设图片的名称为“ 0001.jpg , 0002.jpg ”等。

每张图片都可以从： var imageFilename=$theProduct.find('picture').text();

Answer 1

document.getElementById("picture").src = imageFilename

如果有带有 id picture的<img>标签

Answer 2

如果您使用 jquery，您可以执行以下操作：

$("#picture").attr("src", imageFilename);

Answer 3

document.getElementById('myImage').src = imageFileName;

如果您需要 ImageFileName 中的名称，则可以使用：

name= imageFileName.substring(0, imageFileName.length - 4);/*to chop off .JPG*/

使用jQuery：

$("#myImage").attr("src", imageFilename);

Answer 4

document.getElementById("price").innerHTML= "<img src=\"" + imageurl+ "\">";

您可以使用此代码在内部 div 中显示完整图像，其中 div id 是价格