Selecting elements

See the Pen pvvRrB by yves peeters (@drBenway) on CodePen.

Inserting elements

See the Pen vEOxYp by yves peeters (@drBenway) on CodePen.

Inserting before another element

See the Pen RNWoKO by yves peeters (@drBenway) on CodePen.

Deleting elements and text

See the Pen EaVJqm by yves peeters (@drBenway) on CodePen.

Working with classes

See the Pen OPVpJo by yves peeters (@drBenway) on CodePen.

Looping over DOM nodes

See the Pen LEVWWO by yves peeters (@drBenway) on CodePen.

Selections

Some selections are “live”. Making changes to them reflects in the dom, non-live do not.

  • document.getElementsByClassName() is an HTMLCollection, and is live.
  • document.getElementsByTagName() is an HTMLCollection, and is live.
  • document.getElementsByName() is a NodeList and is live.
  • document.querySelectorAll() is a NodeList and is not live.

HTMLCollections appear to always be live

Source: javascript – When is NodeList live and when is it static? – Stack Overflow

Leave a Reply

Your email address will not be published. Required fields are marked *