neovov / template-element-polyfill

A small polyfill to easily use the <template> element

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

<template> polyfill

A small polyfill to easily use the <template> element.

Why?

Because.

  • Using the <template> element in a browser whom doesn't support it might be a pain, this polyfill fix that (hopefully)
  • Using a <template> element within a <template> element might be a hell, but not anymore with this polyfill.
  • This polyfill might as well cure cancer but it wasn't tested for.

How?

Include the template.js file at the end of your document (or do whatever you prefer).
Get the template you want to use, for instance:

var template = document.getElementById("my-awesome-template");

Use the built-in cloning method (fix a problem with the nested <template> elements):

var clone = template.clone();

You'll end up with a cloned version of the template (duh!).
Replace some tokens, some images' URLs or whatever.
Then, append the content of the template:

document.body.appendChild(clone.content);

Now, take a sip and win a lot of cash!!1

Now?

Fork it.

About

A small polyfill to easily use the <template> element


Languages

Language:JavaScript 100.0%