I was checking out the source on an html page and came across this

<script id="searchItemTemplate" type="text/html"> 
    <# var rows = Math.floor((Model.RecordsPerPage - 1) / 3 + 1);
       for (var i = 0; i < rows; ++i){
        var startIdx = i * 3;
        var endIdx = startIdx + 3;
    #>
//etc .... 
</script>

I have never seen this before. What is script type="text/html". I don't know if it makes a difference but this was on a .aspx page.

Is this some sort of place holder to be parsed and eval() later?
Does anyone know what this is?
Can someone who has used this method explain the benefits?

I was checking out the source on an html page and came across this

<script id="searchItemTemplate" type="text/html"> 
    <# var rows = Math.floor((Model.RecordsPerPage - 1) / 3 + 1);
       for (var i = 0; i < rows; ++i){
        var startIdx = i * 3;
        var endIdx = startIdx + 3;
    #>
//etc .... 
</script>

I have never seen this before. What is script type="text/html". I don't know if it makes a difference but this was on a .aspx page.

Is this some sort of place holder to be parsed and eval() later?
Does anyone know what this is?
Can someone who has used this method explain the benefits?

• asp.net
• javascript
• html
• tags
• script-tag

2 Answers 2

Script elements that have an unknown content-type are simply ignored, in this case, the browser doesn't know how to execute a text/html script.

It's a common technique used by some JavaScript templating engines.

See also:

• JavaScript Micro-Templating
• JavaScript Templating Engines

It's a trick that I first saw in a John Resig blog post. It's used for stuff like holding a template to be expanded later. The browser won't make any attempt to execute it.

The "benefits"? Well, it's a lot neater than keeping a string in your Javascript code directly. Because you don't have multi-line strings in Javascript, it's messy to define a template like that.

edit — ha ha yes, CMS has linked the very blog post in his answer!