|
@@ -261,27 +261,31 @@ document.write(str)
|
|
|
|
|
|
|
|
|
|
|
|
-// HTML tr color//////////////////////////////
|
|
|
+// HTML tr color + HTML th optional////////////
|
|
|
+let keys = persons1.reduce((container, obj) => [...container, ...Object.keys(obj)], []);
|
|
|
+let uniqueKeys = [...new Set(keys)];
|
|
|
var str = "<table border='1'>"
|
|
|
+for (let x = 0; x < uniqueKeys.length; x++) {
|
|
|
+ str += `<th>${uniqueKeys[x]}</th>`
|
|
|
+}
|
|
|
for (let i = 0; i < persons1.length; i++) {
|
|
|
- console.log(persons1[i]);
|
|
|
- if (i % 2 === 0) {
|
|
|
- str += `<tr style="background-color:maroon"><td>${persons1[i].name}</td><td>${persons1[i].surname}</td>
|
|
|
- <td>${persons1[i].fathername}</td><td>${persons1[i].age}</td><td>${persons1[i].sex}</td></tr>`
|
|
|
- }
|
|
|
- else {
|
|
|
- str += `<tr><td>${persons1[i].name}</td><td>${persons1[i].surname}</td>
|
|
|
- <td>${persons1[i].fathername}</td><td>${persons1[i].age}</td><td>${persons1[i].sex}</td></tr>`
|
|
|
+ if (i % 2 === 0) { str += `<tr style="background-color:maroon">` }
|
|
|
+ else { str += '<tr>' }
|
|
|
+ for (let j = 0; j < uniqueKeys.length; j++) {
|
|
|
+ if (Object.keys(persons1[i]).includes([...uniqueKeys][j])) {
|
|
|
+ str += `<td>${persons1[i][[...uniqueKeys][j]]}</td>`
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ str += `<td>===</td>`
|
|
|
+ }
|
|
|
}
|
|
|
+ str += '</tr>'
|
|
|
}
|
|
|
str += "</table>"
|
|
|
console.log(str)
|
|
|
document.write(str)
|
|
|
|
|
|
|
|
|
-// HTML th optional///////////////////////////
|
|
|
-
|
|
|
-
|
|
|
// Задание на синий пояс.
|
|
|
// Сделать HTML-конструктор из деревянной структуры, которая была на прошлом занятии:
|
|
|
var someTree = {
|