From the course: JavaScript: Enhancing the DOM

Unlock the full course today

Join today to access over 22,400 courses taught by industry experts or purchase this course individually.

Controlling node insertions with insertBefore

Controlling node insertions with insertBefore

From the course: JavaScript: Enhancing the DOM

Start my 1-month free trial

Controlling node insertions with insertBefore

AppendChild is a great method, but you don't always want to place an element as a child of another element. You need to be able to insert notes at any position inside a node list. If you watch the last movie, we sorted of cheated a little bit by already having a list item element, in which to place our image. That made it easier to use appendChild, but thankfully there's a great function called Insert Before that lets you place a node in a precise location. Let's take a look at that in a document, so this works a lot like a pen child. Before we use it I need to get into developer tools, so Cmd+Option+I, Ctrl+Alt+I on a PC, and then Esc. Now what I want to do is add a new paragraph in our venue, travel section. So let me click on the Venue/Travel section first and scroll down to right here. I want to put it right in between these two paragraphs. So I'm going to grab the magnifying glass. Click on one of these paragraphs, and there I am. I want to put that right before. So first we are…

Contents