Javascript 设置HTML<；选择>；基于Node.js数据的选项值

从我的节点应用程序中，我试图将MongoDB集合的JSON数组发送到客户端HTML/AJAX。我希望Node.js数据反映在

或

下拉列表中。Node.js响应对象正在发送两个数组
hotarr
和
portArr
，我希望连接相邻的值并在选择选项上显示它。我在下面列出了我的进度，这显然不起作用。在这里寻找解决方案

app.js

MongoClient.connect(url,{ useUnifiedTopology: true }, function(err, db) {
    if (err) throw err;
    var dbo = db.db("mongoDetails");
    dbo.collection("mongoDetails").find({}).toArray(function(err, result) {
      if (err) throw err;
      var hostArr =[];
      var portArr =[];
      for(i=0;i<result.length;i++){
        hostArr.push(result[i].hostname);    
      }
      for(i=0;i<result.length;i++){  
        portArr.push(result[i].port);   
      }
      console.log(hostArr);
      console.log(portArr);
      res.json({mongoDet1:hostArr, mongoDet2:portArr});
      db.close();
    });
  });

MongoClient.connect（url，{useUnifiedTopology:true}，函数（err，db）{
如果（错误）抛出错误；
var dbo=db.db（“mongoDetails”）；
集合（“mongoDetails”）.find（{}）.toArray（函数（err，result）{
如果（错误）抛出错误；
var hostArr=[]；
var-portArr=[]；
对于（i=0；i要执行此操作，可以使用以下方法：

MongoClient.connect(url,{ useUnifiedTopology: true }, function(err, db) {
    if (err) throw err;
    var dbo = db.db("mongoDetails");
    dbo.collection("mongoDetails").find({}).toArray(function(err, result) {
      if (err) throw err;

      var resultArr =[];

      for(i=0;i<result.length;i++){
        resultArr.push({
          hostname: result[i].hostname,
          port: result[i].port
        });    
      }
      console.log(hostArr);
      res.json({content:resultArr});
      db.close();
    });
  });

<div>
    <select id="mongoDetails"></select>
</div>


<script type="text/javascript">
    $(document).ready(function(){   
        var selectElement = document.getElementById('mongoDetails');
        $.ajax({
            url: "http://localhost:8070/api/route1",
            type: 'POST',
            dataType:'json',                    
            success: function(res) {
                console.log(res);
               res.content.forEach(item => {
                 console.log(item);
                   selectElement.options[selectElement.options.length] = new Option(item.hostname, item.port);
              });
            }
        });    
    });                           
</script>

console.log（）
提供了两个数组，但是我没有看到值反映在
选项上，也就是说，响应示例类似于以下内容{mongoDet1:['name1'，'name2']，mongoDet2:[25,79]}包括控制台日志图像以便于理解现在，我希望选择的选项类似于localhost/27017、localhost/27018、localhost/27019…因此我再次更正了答案。我认为问题已经解决
MongoClient.connect(url,{ useUnifiedTopology: true }, function(err, db) {
    if (err) throw err;
    var dbo = db.db("mongoDetails");
    dbo.collection("mongoDetails").find({}).toArray(function(err, result) {
      if (err) throw err;

      var resultArr =[];

      for(i=0;i<result.length;i++){
        resultArr.push({
          hostname: result[i].hostname,
          port: result[i].port
        });    
      }
      console.log(hostArr);
      res.json({content:resultArr});
      db.close();
    });
  });

<div>
    <select id="mongoDetails"></select>
</div>


<script type="text/javascript">
    $(document).ready(function(){   
        var selectElement = document.getElementById('mongoDetails');
        $.ajax({
            url: "http://localhost:8070/api/route1",
            type: 'POST',
            dataType:'json',                    
            success: function(res) {
                console.log(res);
               res.content.forEach(item => {
                 console.log(item);
                   selectElement.options[selectElement.options.length] = new Option(item.hostname, item.port);
              });
            }
        });    
    });                           
</script>

var value = document.getElementById("mongoDetails").value;
console.log(value);