如何在数据数组的每次迭代中创建一个内容为“i+1”的新 HTML 元素

How to create a new HTML element with content "i+1" with each iteration for an array of data

本文关键字：一个 i+1 元素 HTML 的新 数组 数据 创建 迭代      更新时间：2023-09-26

>我目前正在我的网站上显示数据库中的一些数据，它是一个行列表，每个行包含两个元素，一个"名称"和一个"分数"。我使用带有 Ajax 的一些 Jquery 正确显示它们，它获取它们，为它们动态创建一个表，然后将每一行插入到这个表中。

一切都运行良好，但是由于分数是从按分数降序排序的数据库中返回的，因此我想创建要包含在每行中的第三个元素。我希望这个元素是一个排名（如"1st"、"2nd"、"3rd"等），我希望它出现在每行的开头。

这是创建表并插入数据的 Jquery： 

  function makeTable(data){
   var tbl_body = "";
      $.each(data, function() {
        var tbl_row = "";
        $.each(this, function(k , v) {
          tbl_row += "<td>"+v+"</td>";
        })
        tbl_body += "<tr>"+tbl_row+"</tr>";                 
      })
    return tbl_body;
  }

我试过这个：

  function makeTable(data){
   var tbl_body = "";
      $.each(data, function(var i = 0; i++) {
        var tbl_row = "";
        $.each(this, function(k , v) {
          tbl_row += "<td>"+v+"</td>";
        })
        tbl_body += "<tr>"+tbl_row+"<td>"+[i+1]+"</td>"+"</tr>";                 
      })
    return tbl_body;
  }

为了制作如下所示的输出：

1 John Doe 1000 2 Jane Doe 750 3 Jack Daw 500

但它不起作用。创建一个额外的元素可能相对简单，该元素在每次迭代中计数，但我不确定使用正确的语法来实现这一点，任何帮助将不胜感激，提前感谢您！

function makeTable(data){
   var tbl_body = "";
   var index=0;
      $.each(data, function() {
        var tbl_row = "";
        index++;
        $.each(this, function(k , v) {
          tbl_row += "<td>"+v+"</td>";
        })
        tbl_body += "<tr><td>"+index+"</td>"+tbl_row+"</tr>";              
      });
    return tbl_body;
  }

我假设第一个 

$.each(data, function()

正在循环访问行，因此该函数应为您提供该行的索引。

试试这个：

function makeTable(data){
    var tbl_body = "";
    $.each(data, function(i, row) {
        var tbl_row = "";
        tbl_row += "<td>"+i+"</td>";
        $.each(row, function(k , column) {
          tbl_row += "<td>"+column+"</td>";
        })
        tbl_body += "<tr>"+tbl_row+"</tr>";                 
    })
    return tbl_body;
}

你的问题是你在哪里输出"排名"：

[i+1]

这应该在标准操作括号中，而不是索引括号中：

(i+1)
相关文章：