'can one include `templates` in a html file similar to css?

working with html templates. code-wise, it's difficult to keep the right set of templates with each html file.

is it possible to have a file of template(s), much like a file of css, that one includes in the head section of the html file?

for example, to supplement the style section in head, one can link to a stylesheet, eg, 

<link rel="stylesheet" type="text/css" href="mystyle.css" >

my app uses several collections of templates. can they be handled similar to stylesheets, ie, linked to in a separate file, or does each template definition need to be directly part of the original html file?

javascripthtmlhtml-importshtml5-template


Solution 1:[1]

http://www.html5rocks.com/en/tutorials/webcomponents/imports/

You need HTML 5 though

<head>
  <link rel="import" href="/path/to/imports/stuff.html">
</head>

Solution 2:[2]

Unfortunately,

<head>
  <link rel="import" href="/path/to/imports/stuff.html">
</head>

does not work.

The entire stuff.html is stuck in there as html as part of head, and for all practicable purposes inaccessible.

In other words, a template defined instuff.htmlcannot be found usingdocument.querySelector()`, and is therefore unavailable to the script.

fwiw, I don't really understand any advantages of import the way it works now - for it to be any good it needs to strip off (rather than adding) all the outer html before it appends the contents to head - not its current action.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 cc young

Related Questions