From the course: JavaScript Essential Training

Unlock the full course today

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

Add DOM elements

Add DOM elements - JavaScript Tutorial

From the course: JavaScript Essential Training

Start my 1-month free trial

Add DOM elements

- [Instructor] In the example project, I used this template literal to create HTML and then added that HTML to the existing document by targeting an existing element and replacing its internal HTML using the inner HTML property. All that functionality is down here, and we've now covered all the features that make this possible. This is an effective way of injecting new HTML into a document, but it's also rather crude and destructive. It requires an existing element to be in the HTML documents, and it wipes up whatever code was contained inside that element. And that can be a problem. Let me show you what I mean. In the exercise files for this movie, I've added a short intro text to the main section of the document. This new text sits inside the main element. And the problem is when we inject the backpack content using JavaScript, we're replacing all the content inside the main element, so this new text disappears.…

Contents