jquery templates - Templating a HTML page
I'm writing a tool to generate HTML pages using jquery templates, but it does not like certain tags (DOCTYPE, html, head). Is it possible to template some开发者_StackOverflow社区thing like this:
<script id="HtmlPageTemplate" type="text/x-jquery-tmpl">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>${PageTitle}</title>
<link rel="stylesheet" href="styles/style.css" type="text/css" media="all" />
<script src="scripts/script.js">{{html "</sc"+"ript>"}}
<script>
function MyFunction(){
}
{{html "</sc"+"ript>"}}
</head>
<body>
{{tmpl "#PageBody"}}
</body>
</html>
</script>
I'm using {{html "< /sc"+"ript>"}} to close script tags without closing the template script tag.
I think this would be useful for you :
The basic idea is - replace '<' of all sensitive tag with some special mark, e.g., '@#' and replace @# to '<'. Use $.template() to compile the template. Finally, render.
<script id="HtmlPageTemplate" type="text/x-jquery-tmpl">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>${PageTitle}</title>
<link rel="stylesheet" href="styles/style.css" type="text/css" media="all" />
@#script src="scripts/script.js">@#/script>
@#script>
alert('here');
@#/script>
</head>
<body>
{{tmpl "#PageBody"}}
</body>
</html>
</script>
<div id="output"></div>
And replace the template using
$.template('test', $('#HtmlPageTemplate').html().split('@#').join('<'));
$.tmpl('test', data).appendTo($("#output"));
加载中,请稍侯......
精彩评论