Listen to an event when a class has been added to an html element using plain javascript -
i using scroll spy bootstrap
. active
class gets added when scrolling element comes view. normal behavior of scroll spy.
i trying notified when active class gets added li element.
<li key = {`${idx}`} classname = "panel " > <a href = {`#${groupid}`} data-toggle = "collapse" data-parent = {`#${accordionid}`} data-target = {`#menu${idx}`} classname = "temp-link" > menu </a> <ul classname="nav nav-list panel-collapse collapse " id={`${ulidx}`}> <li> .... </li> <li> .... </li> <li> .... </li> </ul> </li>
i trying attach event handler parent li
called when gets active
class. @ time show ul
element via adding class collapse in
. using reactjs , not want use jquery based solutions. simpler javascript based solutions, ideas or suggestions welcomed.
check out mutationobserver
api.
it allows observe specific dom element changes , executes callback if such change occurs. remaining functionality should trivial implement.
mutationobserver
provides developers way react changes in dom. designed replacement mutation events defined in dom3 events specification.
Comments
Post a Comment