⊗jsPmPrTCVOA 471 of 505 menu

Объектілер массивінен HTML кестесін құру

Бізде белгілі бір объектілер массиві берілген делік, мысалы, мынадай пайдаланушылар массиві:

let users = [ { name: 'name1', surname: 'surname1', patronymic: 'patronymic1' }, { name: 'name2', surname: 'surname2', patronymic: 'patronymic2' }, { name: 'name3', surname: 'surname3', patronymic: 'patronymic3' }, ];

Осы массивіден HTML кестесін жасайық, оның әрбір қатарына жеке пайдаланушының деректерін жазайық.

Деректерді сақтаудың мұндай құрылымында әдетте массив бойынша бір цикл іске қосылады және кестенің әрбір ұяшығын қолмен жасайды, мынадай:

<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); }

Мұндай тәсіл үлкен икемділік береді - біз деректерді кесте ұяшықтарында орналасу ретін өзіміз реттей аламыз (мысалы, аты мен тегін орындарын ауыстыра аламыз).

Сонымен қатар, қажет болса, біз белгілі бір ұяшықтарға оқиғаларды тіркеуімізге болады. Мысалы, тегі бар ұяшыққа шерту кезінде қандай да бір әрекетті тіркеуге болады және т.б.

Мынадай жұмысшылар массиві берілген:

let employees = [ {name: 'employee1', age: 30, salary: 400}, {name: 'employee2', age: 31, salary: 500}, {name: 'employee3', age: 32, salary: 600}, ];

Осы массив элементтерін HTML кестесі түрінде шығарыңыз.

Алдыңғы есепті жасы бар кез келген ұяшыққа шерту кезінде оның мазмұны 1-ге артатын етіп өзгертіңіз.

Алдыңғы есепті жалақысы бар кез келген ұяшыққа шерту кезінде оның мазмұны 10%-ге артатын етіп өзгертіңіз.

azbydeenesfrkakkptruuz