18910140161

JavaScript-生成带有数组堆栈溢出的表

顺晟科技

2022-10-19 12:43:06

209

我正在创建一个从数组加载生成动态表的网站。数组为

let products = 
[
   ["product1", "Small Widget", "159753", 33, 22],
   ["product2", "Medium Widget", "258456", 55, 44],
   ["product3", "Large Widget", "753951", 77, 88],
   ["product4", "Not a Widget", "852654", 11, 2],
   ["product5", "Could be a Widget", "654456", 99, 6],
   ["product6", "Ultimate Widget", "321456", 111, 66],
   ["product7", "Jumbo Small Medium Widget", "987456", 88, 11]
   
]

数组为:产品名称、产品说明、产品ID、价格和库存金额。 我需要使表按照名称、ID、描述、价格和库存金额的顺序输出这些字段,然后我需要使价格字段在价格前面有一个$,如果库存金额小于20,则检查库存金额。如果库存少于20,我需要改变单元格的背景色。有人能帮我弄清楚我到底需要怎么做吗?下面是我的js文件,它目前只生成表,但没有生成我需要的格式。

let products = 
[
   ["product1", "Small Widget", "159753", 33, 22],
   ["product2", "Medium Widget", "258456", 55, 44],
   ["product3", "Large Widget", "753951", 77, 88],
   ["product4", "Not a Widget", "852654", 11, 2],
   ["product5", "Could be a Widget", "654456", 99, 6],
   ["product6", "Ultimate Widget", "321456", 111, 66],
   ["product7", "Jumbo Small Medium Widget", "987456", 88, 11]
   
]
let products = 
[
   ["product1", "Small Widget", "159753", 33, 22],
   ["product2", "Medium Widget", "258456", 55, 44],
   ["product3", "Large Widget", "753951", 77, 88],
   ["product4", "Not a Widget", "852654", 11, 2],
   ["product5", "Could be a Widget", "654456", 99, 6],
   ["product6", "Ultimate Widget", "321456", 111, 66],
   ["product7", "Jumbo Small Medium Widget", "987456", 88, 11]
   
]

有人能帮我指点正确的方向吗?我不知道要改变什么才能使桌子正确工作。我希望严格使用常规JavaScript。


顺晟科技:

请查找我添加的更正

  • 表头的界限不正确。我用您所需的头标签创建了一个虚拟数组,并传递给您的函数
  • 在函数中,应该有一些逻辑来区分“价格”和“库存金额”数据。我是用数组的索引做的。索引3属于,索引4属于。
  • 因此,如果索引为3,则追加符号,如果索引为,则根据值向单元格添加背景色。

edit:如果您想使用不同的顺序,可以将顺序本身保存在一个单独的数组中,并像下面这样处理该数组。另外,要获得总和,请使用从单个数组中选择所有字段,并使用某种逻辑填充总和。

工作小提琴

必须按以下方式更新表生成器函数

let products = 
[
   ["product1", "Small Widget", "159753", 33, 22],
   ["product2", "Medium Widget", "258456", 55, 44],
   ["product3", "Large Widget", "753951", 77, 88],
   ["product4", "Not a Widget", "852654", 11, 2],
   ["product5", "Could be a Widget", "654456", 99, 6],
   ["product6", "Ultimate Widget", "321456", 111, 66],
   ["product7", "Jumbo Small Medium Widget", "987456", 88, 11]
   
]
  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航