Ob'ektlar massividan HTML jadval yaratish
Faraz qilaylik, bizda ma'lum bir ob'ektlar massivi berilgan, masalan, quyidagi foydalanuvchilar massivi:
let users = [
{
name: 'name1',
surname: 'surname1',
patronymic: 'patronymic1'
},
{
name: 'name2',
surname: 'surname2',
patronymic: 'patronymic2'
},
{
name: 'name3',
surname: 'surname3',
patronymic: 'patronymic3'
},
];
Keling, ushbu massivdan HTML jadval yasaymiz, uning har bir qatoriga alohida foydalanuvchi ma'lumotlarini yozamiz.
Ma'lumotlarni saqlashning bunday tuzilishida odatda massiv bo'yicha bitta tsikl ishga tushiriladi va jadvalning har bir katagini qo'lda yaratiladi, mana shu tarzda:
<table id="table"></table>
let table = document.getElementById('table');
for (let user of users) {
let tr = document.createElement('tr');
let td1 = document.createElement('td');
td1.textContent = user.name;
tr.appendChild(td1);
let td2 = document.createElement('td');
td2.textContent = user.surname;
tr.appendChild(td2);
let td3 = document.createElement('td');
td3.textContent = user.patronymic;
tr.appendChild(td3);
table.appendChild(tr);
}
Bunday yondashuv katta moslashuvchanlikni beradi - biz ma'lumotlarning jadval kataklari bo'yicha joylashish tartibini o'zimiz boshqarishimiz mumkin (masalan, ism va familiyani o'rnini almashtirishimiz mumkin).
Bundan tashqari, istasak, ma'lum kataklarga hodisalarni bog'lashimiz mumkin. Masalan, familiya yozilgan katakka bosilganda biron bir harakatni bog'lash mumkin va hokazo.
Quyidagi xodimlar massivi berilgan:
let employees = [
{name: 'employee1', age: 30, salary: 400},
{name: 'employee2', age: 31, salary: 500},
{name: 'employee3', age: 32, salary: 600},
];
Ushbu massiv elementlarini HTML jadval ko'rinishida chiqaring.
Oldingi vazifani shunday o'zgartiringki,
yosh yozilgan har qanday katakka bosilganda
uning tarkibi 1 ga oshadi.
Oldingi vazifani shunday o'zgartiringki,
maoshi yozilgan har qanday katakka bosilganda
uning tarkibi 10% ga oshadi.