Verify Observer Text with airSlate SignNow

Create observer text

dealing with dom mutations in vanilla javascript is difficult but mutation observer makes it just a little bit easier [Music] welcome back to web dev simplified my name is kyle and my job is to simplify the web for you so you can start building your dream project sooner and today we're going to talk about mutation observer and all the amazing use cases for it so to get started i have a really simple html page you can see here we have a parent which has an id and a class of parent as well as it has three children inside of them and you can see on the right hand side of my screen in the top section you can see these three different children and i also have these children editable so i can actually just change the text inside of them as i need i also have the console open down below because we're going to be doing a bunch of stuff in our script file here and i want to make sure we can see our console so the first thing i want to do is i want to show you how you can create a mutation observer so we can create a mutation observer and this is coming from a class called mutation observer so we just create a new mutation observer and this mutation observer constructor here takes one single argument and this argument is a function that is going to be called every single time your mutation observer observes some type of mutation in the dom based on some criteria we define in a little bit and this function here takes a single property into it called entries and this entries is an array of all the different mutations that occurred for now i'm just going to do a simple console log of this entries it's going to make it a lot easier for us to understand what's going on with this and then what we want to do is we actually want to set up our observer to make it observe something because right now we created an observer but we haven't told it what we want to observe so to do that we can just say mutation observer which is the thing we just created we can call the observe function and this takes in two parameters the first is going to be the thing we want to observe and the second is going to be all the options for that so let's just get the parent element we can say const parent is equal to document.queryselector we want to get that parent that has the class of parent and we can observe that parent object and if i save you're going to notice immediately we get an error and that's because essentially with mutation observer when you observe something you need to tell it what you want to observe because mutation observer can observe literally every single thing about...