如何在图像src属性中连接URL



我正试图从对象数组中填充一个表。html是一个简单的表,它由以下代码段填充。

每一行对应的图像都有相同的URL,并且在同一个文件夹中,但它有不同的id(我只是简单地称它们为1.png、2.png、3.png……等等(。

基本上,我试图通过为每一个新行一次又一次地将id连接到同一个URL来构建每个URL。

除了URL构建失败的视频部分外,其他部分都运行良好。连接URL时是否遗漏了什么?

$(function() {
var content = [{
title: 'My-title',
date: '22.10.2020',
manager: 'John Doe',
certification: 'no',
language: 'English ',
description: 'Ipsum dolor sit..',
video: 55
}];
$.each(content, function(index, v) {
var nTr = "<tr>"
var url_ =
nTr += "<td><p>" + v.title + "</p></td>";
nTr += "<td><p>" + v.date + "</p></td>";
nTr += "<td><p>" + v.manager + "</p></td>";
nTr += "<td><p>" + v.certification + "</p></td>";
nTr += "<td><p>" + v.language + "</p></td>";
nTr += "<td><p>" + v.description + "</p></td>";
nTr += "<td><p><img src = 'https://myftp.link.com/TPS/media/' + v.content[0].video + '.png'></p></td>";
nTr += "</tr>";
console.log(nTr, typeof nTr, "yolo");
$(nTr).appendTo('#toc_');
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table table-striped table-bordered table-hover" id="sample_1">
<thead>
<tr>
<th>
Title
</th>
<th>
Date
</th>
<th>
Manager
</th>
<th>
Certification
</th>
<th>
Language
</th>
<th>
Description
</th>
<th>
Video
</th>
</tr>
</thead>
<tbody id="toc_"></tbody>
</table>

包含img的行应该是:

nTr += "<td><p><img src = 'https://myftp.link.com/TPS/media/" + v.content[0].video 
+ ".png'></p></td>";

注意:我更改了引号-JS部分前后的双引号,URL的开头和结尾只有单引号。

最新更新