我对如何在 html 表格中显示图像有疑问。
根据下面的代码,图像列仅显示图像的链接,而不显示图像本身。如何将实际图像显示到我的图像列中?
root.on('child_added', function(childSnapshot) {
rootRef10 = childSnapshot.val();
var tr = document.createElement('tr');
tr.appendChild(createCell(imageUrl));
tr.appendChild(createCell(videoUrl));
table.appendChild(tr);
});
function createCell(text) {
var td = document.createElement('td');
td.appendChild(document.createTextNode(text));
return td;
}
最佳答案
尝试使用这个:
// put your image url as the url parameter
function createImageCell(url) {
var td = document.createElement('td');
var img = document.createElement("img");
img.src = url;
td.appendChild(img);
return td;
}
所以基本上用 tr.appendChild(createImageCell(imageUrl)); 替换
tr.appendChild(createCell(imageUrl));
编辑:如果您想设置宽度和高度,您可以执行以下任一操作:
function createImageCell(url) {
var td = document.createElement('td');
var img = document.createElement("img");
img.src = url;
img.width = 800; // specify width here
img.height = 800; // specify height here
td.appendChild(img);
return td;
}
或者,如果您希望每个图像具有不同的宽度和高度,您可以这样做:
function createImageCell(url, width, height) {
var td = document.createElement('td');
var img = document.createElement("img");
img.src = url;
img.width = width;
img.height = height;
td.appendChild(img);
return td;
}
然后每当调用该方法时指定每个图像的宽度和高度。
关于javascript - 如何将firebase中的图像url显示到html表中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57943542/