0

I've recently been looking into using JavaScript for templating and I was wondering about the legibility of using this approach.

I understand that JavaScript templating is a very common and much accepted form of templating and I do see the benefits of using this technique.

My question stems more from curiosity as storing HTML text inside a script breaks away from what a 'script' actually is, so to me it feels wrong to do this.

  1. Was JavaScript originally designed to be used as a templating technique when the browser does not understand the type of script? Or was it a trick that people discovered and began to use as HTML text holders for templating purposes?

  2. I've also read that unknown scripts are not processed as scripts and are left as text blocks because of compatibility reasons - so newer browsers can support additional languages without older browsers breaking. Is this maybe the reason for leaving in unknown scripts as text blocks?

I'm trying to understand why browsers behave in the way they do when unknown scripts are found/the intention behind this behaviour.

8
  • Templating is not a trick... it's a bona-fide technique. No trickery is required. So the premise underlying your question might be invalid. What is an "unknown script?" May 2, 2016 at 19:23
  • @RobertHarvey Scripts written in a language that the browser doesn't recognize? Although, Firefox seems to simply ignore Python scripts altogether, rather than putting the script text into the rendered page.
    – 8bittree
    May 2, 2016 at 19:40
  • 2
    I'm struggling to understand what "unknown scripts" have to do with templating techniques. May 2, 2016 at 19:41
  • They are related because unknown scripts are used for javascript templating. In order to supply a javascript templating library with a template you give a script a type which is unknown to the browser (but acknowledged by the javascript template engine) so that the script is not processed as a script, it is listed in the DOM as a data block (simply a block of plain text)
    – Brummy
    May 2, 2016 at 20:16
  • @RobertHarvey There's a technique where we stuff HTML fragments into a script tag, e.g. <script type="application/my-template">Html fragment <i>{{placeholder}}</i></script>. The browser ignores these contents because it can't handle the mime type for a script. However, the template can be accessed via JS and then rendered dynamically.
    – amon
    May 2, 2016 at 20:21

1 Answer 1

2

Are you talking about the use of <script>-elements to store HTML templates? The purpose of the script element was to embed scripts, but the HTML spec does not mandate which languages should be supported by the browser. In case the specified language is not supported by the browser, the default behavior (mandated by HTML) is simply to hide the text. This means it can be used to store arbitrary text and code.

I don't think HTML templates were part of the original use case for the script element, but it is still a legitimate use. In current HTML, the script element is defined to be either a script or a data block, which could be any kind of arbitrary data, obviously including HTML-templates.

2
  • Do you have a link for where a script is defined to be either a script or data block? :)
    – Brummy
    May 2, 2016 at 20:51
  • @Brummy: html.spec.whatwg.org/multipage/… "Setting the attribute to any other value means that the script is a data block, which is not processed."
    – JacquesB
    May 2, 2016 at 20:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.