Javascript 在包含数据的表格列中显示图像

我正在firebase cloudfirestore上工作，我想用数据在表列中显示图像

目前我尝试使用setattribute显示图像，但是当我更改为数据集输入时，图像仅显示URL。如果需要，可以提供更多信息

添加检查

视图检查

uploadimage.js
var downloadU=“”；
uploadTask.snapshot.ref.getDownloadURL（）.then（函数（downlaodURL）{
//在此处获取您的上传图像url。。。
downloadU=downloadurl；
控制台日志（downlaodURL）；
document.getElementById（'showImg'）。innerHTML=''；
});
函数returnPath（）
{
返回下载；
}
addinspection.js
让photo=document.createElement（'img'）；
photo.textContent=doc.data（）['photo']；
photo.setAttribute（'src'，photo.textContent）；
表格.addEventListener（'submit'，（e）=>{
e、 预防默认值（）；
db.集合（“检查”）。添加({
照片：下载，
HazardDescription:form['HazardDescription'].值，
位置：表单['Location']。值，
}).然后（（）=>{
window.location.href=“addinspection.html”；
})
表单['photo']。值=''；
形式['HazardDescription']。值=''；
表单['Location']。值=''；
viewinspection.js
函数可渲染（doc）{
dataSet.push（[++count，doc.data（）['photo']，doc.data（）['hazarddescription']，doc.data（）['Location']）；
}
db.collection（'Inspection'）.onSnapshot（快照=>{
let changes=snapshot.docChanges（）；
changes.forEach（change=>{
如果（change.type=='added'）{
可渲染（change.doc）；
}else if（change.type==“已删除”）{
让li=tbody.querySelector（'[data id='+change.doc.id+']）；
t体外培养（李）；
}
})
$（'#dataTable'）。dataTable({
数据：数据集
});
})

---

预期结果应在列中显示图像，而不是URL。

我没有看到

img

html标记。JS代码的哪一部分应该显示图像？我已添加了代码行，感谢您提醒我这一点。您的问题可能与firebase无关，因为图像URL正确地从数据库中获取，并显示在s上屏幕，基于您上传的屏幕截图。（不是作为图像，而是作为普通图像url txt）。您如何设置

img

html标记可能有问题。请查看或类似问题。

uploadimage.js
var downloadU = "";
 uploadTask.snapshot.ref.getDownloadURL().then(function (downlaodURL) {
            //get your upload image url here...
            downloadU = downlaodURL;
            console.log(downlaodURL);
            document.getElementById('showImg').innerHTML = '<img src="' +  downlaodURL + '" width="50%" height="50%">';
        });

function returnPath()
{
    return downloadU;
}

addinspection.js
let photo = document.createElement('img');
    photo.textContent = doc.data()['photo'];
    photo.setAttribute('src', photo.textContent);

form.addEventListener('submit', (e) => {
    e.preventDefault();
    db.collection('Inspection').add({
        photo : downloadU,
        HazardDiscription : form['HazardDiscription'].value,
        Location : form['Location'].value,
    }).then(() => {
        window.location.href = "addinspection.html";
    })

    form['photo'].value = '';
    form['HazardDiscription'].value = '';
    form['Location'].value = '';

viewinspection.js
function renderTable(doc){ 
dataSet.push([++count, doc.data()['photo'], doc.data()['HazardDiscription'], doc.data()['Location']);
}

db.collection('Inspection').onSnapshot(snapshot => {
    let changes = snapshot.docChanges();
    changes.forEach(change => {
        if(change.type == 'added'){
            renderTable(change.doc);
        } else if (change.type == 'removed'){
            let li = tbody.querySelector('[data-id=' + change.doc.id + ']');
            tbody.removeChild(li);
        }
    })

    $('#dataTable').DataTable({
        data: dataSet
    });
})