如何在JavaScript的for循环中嵌套If语句筛选展示指定ID的数据行

问题原因 #

你写的判断逻辑存在两个语法错误：

• 单等号=是赋值运算符，不是比较运算符，写在判断里会直接把id字段的值修改为"3081"，所以你会看到ID列显示内容被修改
• 逻辑或||不能直接拼接多个目标值，你写的"54" || "56"会被直接判定为布尔值true，导致所有行都会满足判断条件

实现步骤 #

1. 先定义需要展示的ID集合

在for循环的上方加一行代码，把你要展示的25个ID都放进这个数组即可：

// 这里我只写了你示例里的3个ID，剩下22个你按同样格式补全就行，ID如果是数字类型就去掉引号
const targetIds = ["3081", "54", "56"];

2. 在for循环里加ID匹配判断

在计算完bidprice、askprice之后，组装行代码<tr>的前面加一行判断，不匹配的直接跳过即可：

// 当前ID不在目标列表里就跳过，不渲染这一行
if (!targetIds.includes(priceDatas[i]["id"])) continue;

修改后的完整代码示例 #

// 第一步：新增目标ID数组，替换为你实际要展示的25个ID
const targetIds = ["3081", "54", "56"];
let table = "";

for(var i=0; i<priceDatas.length; i++){
    var bidprice = "";
    var askprice = "";
    
    if(priceDatas[i]["bidPrice"]){
      bidprice = priceDatas[i]["bidPrice"] - (priceDatas[i]["bidPrice"] * 1.5 / 100);
      bidprice = bidprice.toFixed(2);
      bidprice = "$" + bidprice;
    } else if(priceDatas[i]["Bid %"]){
      bidprice = priceDatas[i]["Bid %"] - (priceDatas[i]["Bid %"] * 1.5 / 100);
      bidprice = bidprice.toFixed(2);
      bidprice = bidprice + "%";
    }
    
    if(priceDatas[i]["askPrice"]){
      askprice = priceDatas[i]["askPrice"] + (priceDatas[i]["askPrice"] * 1.5 / 100);
      askprice = askprice.toFixed(2);
      askprice = "$" + askprice;
    } else if(priceDatas[i]["Ask %"]){
      askprice = priceDatas[i]["Ask %"] + (priceDatas[i]["Ask %"] * 1.5 / 100);
      askprice = askprice.toFixed(2);
      askprice = askprice + "%";
    }
    
    // 第二步：新增ID匹配判断，不匹配就跳过渲染
    if (!targetIds.includes(priceDatas[i]["id"])) continue;

    var column = "<tr>";
    column = column + "<td>" + priceDatas[i]["Display Name"] + "</td>" + "<td>" + `${bidprice? bidprice :"-"}` + "</td>" + "<td>" + `${askprice? askprice :"-"}` + "</td>" + "<td>" + priceDatas[i]["id"] + "</td>";
    column = column + "</tr>";
    table = table + column;
    
  }
  
document.getElementById("price_table").innerHTML = "<tr class='header-table'><td>Product</td><td>Bid</td><td>Ask</td><td>ID</td></tr>" + table;

注意：如果你的ID字段是数字类型而非字符串，把targetIds里的ID引号去掉即可，比如const targetIds = [3081, 54, 56];

内容的提问来源于stack exchange，提问作者Inventive Web Design