O'Reilly logo

HTML5 Web Application Development By Example Beginner's guide by J.M. Gustafson

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

HTML templates

As you can see, things are getting a little messy in our addTaskElement() method. We are creating a bunch of elements programmatically in JavaScript and manually adding them to the DOM. Wouldn't it be a lot easier if we could just define what we want the task element's structure to look like in our HTML file and use it to create new tasks? Well we can, and we will. In this section we'll create an HTML template that we can reuse to easily create new tasks.

Note

There are plenty of JavaScript libraries out there for implementing HTML templates and they have a lot of powerful features, but for our application all we need is something simple, so we'll implement our own.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required