<body>
<p>1</p>
<p>2</p>
<p>3</p>
</body>
<script>
const [p1, p2, p3] = document.querySelectorAll('p');
// console.log(p1, p2, p3);
// const m = new Map();
// m.set(p1, 'red');
// m.set(p1, 'green');
// m.set(p1, 'blue');
const m = new Map([
[p1, {
color: 'red',
backgroundColor: 'yellow',
fontSize: '40px'
}],
[p2, {
color: 'green',
backgroundColor: 'pink',
fontSize: '40px'
}],
[p3, {
color: 'blue',
backgroundColor: 'orange',
fontSize: '40px'
}]
]);
m.forEach((propObj, elem) => {
for (const p in propObj) {
elem.style[p] = propObj[p]
}
})
// m.forEach((color, elem) => {
// elem.style.color = color
// })
console.log(m);
</script>