The HTML template element is a mechanism for holding client-side content that is not to be rendered when a page is loaded but may subsequently be instantiated during runtime using JavaScript.
Questions tagged [html5-template]
108 questions
21
votes
2 answers
html template tag and jquery
I've got this situation where I'm trying to use the tag in my html source:
19
votes
4 answers
HTML Templates JavaScript polyfills
I'm looking for the most standards-compliant / future-proof method for front-end HTML templating.
There exists a relatively new W3C draft specification for HTML Templates, e.g.:
![great image]()
Robin Winslow
- 10,908
- 8
- 62
- 91
15
votes
4 answers
How to remove a shadow root from an HTML element adorned with a Shadow DOM from a template?
I'm exploring imports, templates, shadow DOM and custom elements in Chrome Canary (33.0.1712.3). In a grid layout I have a particular content element (region of the display) that will display different web components or cloned light DOM fragments…
wjohnson
- 711
- 1
- 8
- 19
12
votes
2 answers
Use of Template with HTML Custom Elements
I just started learning about the HTML custom elements, and through reading a series of intros, tutorials, and documentation, I think I have a good handle on how it works, but I have a philosophical question on the proper way to use or not use the…
bjg222
- 827
- 1
- 11
- 21
11
votes
6 answers
HTML5 template not working on Internet Explorer, how to solve it?
I made a template in HTML5 which is working with Chrome and Firefox but not working with Internet Explorer (tested on IE 8).
How can I solve this problem?
knotty
- 133
- 1
- 1
- 7
10
votes
1 answer
Share style across web components "of the same type"
If I understand it correctly, creating an instance of a web component can be summed up as creating a shadow root and copying the markup, e.g. from a template into it:
var Template = document.querySelector('#myTemplate');
var TemplateClone =…
Michael K
- 1,070
- 1
- 10
- 25
10
votes
3 answers
Include template file in an HTML file, similar to CSS?
I am working with HTML elements. Code-wise, it seems inconvenient to keep the correct set of templates inside each HTML file.
Is it possible to put templates in a separate file? I want something like CSS, where I can include CSS files in…
cc young
- 18,939
- 31
- 90
- 148
9
votes
3 answers
How does a browser handle a tag VS a tag
I have been reading the documentation on the tag, and I can't seem to understand how it is different from simply using a that is display: none;
Documentation: template tag
example
PrivatMamtora
- 2,072
- 2
- 19
- 29
9
votes
3 answers
Setting HTML Button`onclick` in template literal
I have an html template that i'm using template literals for. The function looks like the below
// postCreator.js
export const blogPostMaker = ({ title, content, address, id }, deletePost) => {
const innerHtml = `
Elliott McNary
- 1,149
- 3
- 11
- 20
9
votes
3 answers
How can I create a web component that acts like a form element?
I am trying to create a web component that is usable in a form element specifically, that has a name, and a value. I recognize that I can create a web component that extendsan HTMLInputElement:
but I am trying to create…
KevBot
- 17,900
- 5
- 50
- 68
9
votes
2 answers
How to let imported css font / icons have effects on elements in the shadow dom?
Say if I want to create a custom element using shadow dom. Some elements in the template have class names specified in the linked css file. Now I want to let the css rules have effects on the elements. But I can't achieve that because of the shadow…
Zhengquan Bai
- 1,057
- 3
- 14
- 31
8
votes
1 answer
Nested element (web component) can't get its template
I made a simple example using Web Components with two custom elements (v1) where one is nested in another.
index.html:
Example
james bay
- 113
- 6
8
votes
2 answers
HTML Template Element: Clarification
I have recently discovered the HTML template element, and would appreciate some clarification.
As far as I can tell, the three distinguishing features are:
template is not rendered on screen
template does not make its way to the DOM
there is an…
Manngo
- 14,066
- 10
- 88
- 110
7
votes
1 answer
"Broken" links inside a tag
I've recently started using the tag for HTML that I process afterwards using a template library, e.g.
...
I have been reading the documentation on the tag, and I can't seem to understand how it is different from simply using a
that is display: none;
Documentation: template tag
example
PrivatMamtora
- 2,072
- 2
- 19
- 29
9
votes
3 answers
Setting HTML Button`onclick` in template literal
I have an html template that i'm using template literals for. The function looks like the below
// postCreator.js
export const blogPostMaker = ({ title, content, address, id }, deletePost) => {
const innerHtml = `
Elliott McNary
- 1,149
- 3
- 11
- 20
9
votes
3 answers
How can I create a web component that acts like a form element?
I am trying to create a web component that is usable in a form element specifically, that has a name, and a value. I recognize that I can create a web component that extendsan HTMLInputElement:
but I am trying to create…
KevBot
- 17,900
- 5
- 50
- 68
9
votes
2 answers
How to let imported css font / icons have effects on elements in the shadow dom?
Say if I want to create a custom element using shadow dom. Some elements in the template have class names specified in the linked css file. Now I want to let the css rules have effects on the elements. But I can't achieve that because of the shadow…
Zhengquan Bai
- 1,057
- 3
- 14
- 31
8
votes
1 answer
Nested element (web component) can't get its template
I made a simple example using Web Components with two custom elements (v1) where one is nested in another.
index.html:
Example
james bay
- 113
- 6
8
votes
2 answers
HTML Template Element: Clarification
I have recently discovered the HTML template element, and would appreciate some clarification.
As far as I can tell, the three distinguishing features are:
template is not rendered on screen
template does not make its way to the DOM
there is an…
Manngo
- 14,066
- 10
- 88
- 110
7
votes
1 answer
"Broken" links inside a tag
I've recently started using the tag for HTML that I process afterwards using a template library, e.g.
...