Is there an effective way to get notified of changes to an attribute of an HTML DOM element?

I have a list <ul><li>and I need to know the current width/ heighteach <li>. Suppose one of these attributes changes for an external reason (and not for my own code), for example, by resizing the browser, using another script, exchanging styles, or something like that, which I cannot control with my own code.

What is the best and most efficient (effective) way to track these changes?

My first solution would be setInterval(myMonitorFunction, 100)to iterate over all the relevant DOM elements. It is slow (100 ms), and it also consumes more performance, the larger the list of items.

For form elements, there is an event onchangedthat allows you to effectively control input values. I am looking for something similar (and similar effective) for all / other attributes of a DOM element, but so far I cannot find any good solution.

+3
source share
1 answer

There is DOMAttrModified, but it is only supported in modern browsers. If you want to support older browsers (e.g. IE), there is no easy way to do this other than the one you talked about (which, of course, is superfluous).

+1
source

Source: https://habr.com/ru/post/1789470/