如何在数组变量中添加bootstrap卡，以便将来可以添加更多代码而无需编写更多代码？

Question

我有一张存储网站数据的卡片（虽然不确定它是否是用数据实现图像的最佳方式）。像这样：

enter code here<div class="row">

    

    <div class="thumbnail">
        <img height="auto align-self-strech col-xs-3" class="card-img-top" src="http://1.bp.blogspot.com/-Ex9nL9iB34E/Tf8gTFiGqdI/AAAAAAAAE1A/lx8E4lYwVR0/s1600/Ahoban++by+Habib+Wahid+album+2011.jpg" alt="Card image cap">

         <div class="card-body">
    <h5 class="card-title">আহ্বান - হাবীব</h5>
    <p class="card-text">হাবীবের নতুন একক এলবাম</p>
    <a href="#" class="btn btn-primary">দেখুন</a>
  </div>

    </div>

</div>

    

    <div class="thumbnail">
            <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSFgR41SZX2C-ovvvfCZ7mwqzPvyj6Q8CMhZ31yjaKLIoPUj-Ss7A">
         <div class="card-body">
    <h5 class="card-title">বেষ্ট অফ মিনার</h5>
    <p class="card-text">গান বাংলা থেকে প্রকাশিত মিনারের একক এলবাম</p>
    <a href="#" class="btn btn-primary">দেখুন</a>
  </div>

    </div>

</div>

如何在javascript中将它们插入数组中以与数据库进行交互？目前我正在使用Mongodb。 另外，我是否必须制作一张带有类图像，名称等的空卡，以便由数据库推送？

Answer 1

如果我理解正确，您想要用HTML创建一张卡片并用数据库中的数据填充它。这可以通过多种方式完成，包括手动。但我建议你使用一个框架。例如ReactJS，VueJS，Angular或类似内容。

您可以创建要填充的模板，并使用框架调用该模板并使用数据填充它。数据库无关紧要。