Middle
Kako dobiti širinu DOM elementa i pratiti njegove promene? Može li se na DOM element dodati resize putem addEventListener?
sobes.tech АИ
Одговор од АИ
Чтобы получить ширину 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-элемента.