Stack Overflow
Stack Overflow

Questions tagged [mutation-observers]

Mutation Observers are part of the DOM4 specification, and allow callbacks to be triggered when elements of the DOM change.

Mutation Observers are part of the DOM4 draft spec, and are meant to replace Mutation Events which are defined in DOM3. WebKit and Firefox are the first browsers to support the mutation observers API.

Links

652 questions
373
votes
11 answers

Detect changes in the DOM

I want to execute a function when some div or input are added to the html. Is this possible? For example, a text input is added, then the function should be called.
esafwan
  • 17,311
  • 33
  • 107
  • 166
163
votes
8 answers

How can I be notified when an element is added to the page?

I want a function of my choosing to run when a DOM element is added to the page. This is in the context of a browser extension, so the webpage runs independently of me and I cannot modify its source. What are my options here? I guess that, in…
Kevin Burke
  • 61,194
  • 76
  • 188
  • 305
119
votes
1 answer

Performance of MutationObserver to detect nodes in entire DOM

I'm interested in using MutationObserver to detect if a certain HTML element is added anywhere in an HTML page. For example's sake, I'll say that I want to detect if any
  • 's are added anywhere in the DOM. All the MutationObserver examples I've…
    • Jake Wilson
    • 88,616
    • 93
    • 252
    • 370
    57
    votes
    4 answers

    'observe' on 'MutationObserver': parameter 1 is not of type 'Node'

    I am creating a Chrome extension and trying to include a small text beside the SEND button of the gMail compose box. I am using a MutationObserver to know when the compose box window appears. I am doing this by observing an element with class no…
    geet mehar
    • 642
    • 1
    • 5
    • 10
    55
    votes
    2 answers

    An event or observer for changes to getBoundingClientRect()

    Is there a way to detect when an element's getBoundingClientRect() rectangle has changed without actually calculating getBoundingClientRect()? Something like a "dirty flag"? Naively, I assume that there must be such a mechanism somewhere in the…
    micahscopes
    • 1,034
    • 1
    • 9
    • 12
    51
    votes
    6 answers

    Most efficient method of detecting/monitoring DOM changes?

    I need an efficient mechanism for detecting changes to the DOM. Preferably cross-browser, but if there's any efficient means which are not cross browser, I can implement these with a fail-safe cross browser method. In particular, I need to detect…
    Graza
    • 5,010
    • 6
    • 32
    • 37
    50
    votes
    4 answers

    Can jQuery selectors be used with DOM mutation observers?

    HTML5 includes a concept of "mutation observers" to monitor changes to the browser's DOM. Your observer callback will be passed data which looks a lot like DOM tree snippets. I don't know if they are exactly this or how they work really. But when…
    hippietrail
    • 15,848
    • 18
    • 99
    • 158
    48
    votes
    2 answers

    Can a single MutationObserver object observe multiple targets?

    I would like to use a MutationObserver object to observe changes to some of my DOM nodes. The docs give an example of creating a MutationObserver object and registering it on a target. // select the target node var target =…
    Luke
    • 5,567
    • 4
    • 37
    • 66
    40
    votes
    3 answers

    Mutation Observer for creating new elements

    I am trying to make a function go off when a particular div is created. In the simplest of terms, I have something like this: Click me!