Middle
Cum se obține lățimea unui element DOM și cum se monitorizează modificările sale? Se poate atașa un resize pe un element DOM folosind addEventListener?
sobes.tech AI
Răspuns de la AI
Чтобы получить ширину DOM-элемента, можно использовать свойство offsetWidth или getBoundingClientRect().width:
const element = document.getElementById('myElement');
const width = element.offsetWidth;
// или
const widthRect = element.getBoundingClientRect().width;
Для отслеживания изменений ширины элемента нельзя напрямую повесить событие resize через addEventListener, так как событие resize доступно только на объекте window.
Вместо этого используют ResizeObserver — современный API, который позволяет отслеживать изменения размеров элементов:
const resizeObserver = new ResizeObserver(entries => {
for (let entry of entries) {
console.log('Новая ширина:', entry.contentRect.width);
}
});
resizeObserver.observe(element);
Таким образом, ResizeObserver — правильный способ отслеживать изменения размеров DOM-элемента.