使用 JavaScript 创建表格

Question

I'm supposed to create a table like this from scratch using JavaScript and I have no idea how.

Am I supposed to use array for this?

I'm still new to JavaScript and this is my first week of learning it. Thanks for the help!

BMI                   Health category

Below 18.5            Under weight

Between 18.5 and 23   Normal weight

Between 23 and 27.5   Over weight

Above 27.5            Obese

Answer 1

Creating table in Pure JS:

 var table_header = ['BMI', 'Health category']; var table_rows = [ ['Below 18.5', 'Under weight'],['Between 18.5 and 23', 'Normal weight'], ['Between 23 and 27.5', 'Over weight'],['Above 27.5', 'Obese'] ]; var dom_body = document.getElementsByTagName('body')[0]; var table = document.createElement('table'); var tbody = document.createElement('tbody'); //use for loop to add row and cells into the table body var tr = document.createElement('tr'); table_header.forEach(function(value,index){ var td = document.createElement('td'); //table cell td.innerHTML= value; //set cell value tr.appendChild(td); //add it into row }) tbody.appendChild(tr); //add table header //insert table rows table_rows.forEach(function(row,index){ var tr = document.createElement('tr'); //append cells for this current row row.forEach(function(value,index){ var td = document.createElement('td'); //table cell td.innerHTML= value; //set cell value tr.appendChild(td); //add it into row }) tbody.appendChild(tr); //add row }) //add the table in the dom table.appendChild(tbody); dom_body.appendChild(table);