如何使用 javascript 将检索到的 firebase 数据设置到 div 中

Question

我想将数据放入我已经从 firebase 检索到的 div 中。这是我的 JavaScript 代码：var rootRef = firebase.database().ref().child("products");rootRef.on("child_added", snap => {    alert(snap.val());    var image = snap.child("image").val();    var desp = snap.child("description").val();    $("#product_section").append();});我应该在附加括号中写入什么以将数据显示为以下格式的 html 代码：<div id="product_section" class="container">        <div class="row">          <div class="col-md-6 col-sm-6 productDetails">            <p>Something from description field of Firebase 1 </p>          </div>          <div class="col-md-6 col-sm-6">            <img src="image src form Firebase">          </div>        </div>        <div class="row">          <div class="col-md-6 col-sm-6 productDetails">            <p>Something from description field of Firebase 2 </p>          </div>          <div class="col-md-6 col-sm-6">            <img src="image src form Firebase">          </div>        </div></div>我想分别在“<img>”和“<p>”之间显示图像和描述字段。

Answer 1

看来你的工作快完成了。

要将 html 标签放入 div，请使用 $("#product_section").append(); 需要一个字符串作为输入，其中包含相应的结构，如下所示：

var image_and_desp_string = 

   '<div class="row">'

     + '<div class="col-md-6 col-sm-6 productDetails">'

         + '<p>' + desp + '</p>'

     + '</div>'

     + '<div class="col-md-6 col-sm-6">'

         + '<img src="' + image + '">'

     + '</div>'

 + '</div>';

$("#product_section").append(image_and_desp_string);

我尝试将代码与 html 标签对齐，以便更容易比较。