Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Vanessa Snipe
7,108 PointsDoes JS only interact when there are events?
What if there is an aria-hidden attribute that changes from true to false. Can one make like a button disappear when a drawer appears or is disappears.
So if an add to cart button opens a drawer and there is an attribute aria-hidden="true" when it opens. as soon as it's closed it changes to aria-hidden="false" can we make something disappear and reappear?
Vanessa Snipe
7,108 PointsMadushan Perera but can we make javascript do something when the state of an attribute changes... does that make sense. even if it's like a data attribute. If the value changes can javascript "react" to it?
Madushan Perera
7,624 PointsBy looking at the attribute value, we can do changes. You can check what value is set to the particular attribute by using getAttribute()
Vanessa Snipe
7,108 PointsSo what I'm asking is can an event be a change in an attribute or does it have to be i.e. "element".addEventListener ('click', ()=>{ If (attr === "change status"){}})
or is there such thing as an EventListener that listens for dom changes... if that makes sense?
1 Answer
Madushan Perera
7,624 PointsYes, you can use MutationObserver to check whether the attribute is changed or not. This is like an event (like addEventListener but little but different the way we are using it). This object is used to observe the dom.
You can find more information here
Madushan Perera
7,624 PointsMadushan Perera
7,624 PointsA hidden attribute is a boolean attribute (True/False). When this attribute is used on an element, it removes all relevance to that element. When a user views the HTML page, elements with the hidden attribute should not be visible.
Aria-hidden attributes indicate that the element and ALL of its descendants are still visible in the browser, but will be invisible to accessibility tools, such as screen readers.
I hope this link will help you.