Posted By

vissper on 02/11/10

Tagged

Versions (?)

Last Edited at 02/11/10 04:50am

Statistics

Viewed 710 times

Favorited by 0 user(s)

Related snippets

Simple template

/ Published in: HTML

[Ð˜ÑÑ‚Ð¾Ñ‡Ð½Ð¸Ðº](http://sreznikov.blogspot.com/2010/01/supplant.html)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

<!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>
		<!-- http://sreznikov.blogspot.com/2010/01/supplant.html  -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<body>
 
	<div id="root">
	</div>
		<script type="text/javascript" charset="utf-8">
 
			/**
			 * supplant() does variable substitution on the string. It scans
			 * through the string looking for expressions enclosed in {} braces.
			 * If an expression is found, use it as a key on the object,
			 * and if the key has a string value or number value, it is
			 * substituted for the bracket expression and it repeats. 
			 */
			String.prototype.supplant = function(o) {
			    return this.replace(/{([^{}]*)}/g,
			        function(a, b) {
			            var r = o[b];
			            return typeof r === 'string' || typeof r === 'number' ? r : a;
			        }
			    );
			};
 
			var template = '<div class="preview"><p class="image"><a href="{url}"><img src="{thumb_src}" width="{thumb_width}" height="{thumb_height}"/></a></p><p class="caption">{caption}</p></div>';
 
			var data = {
			    url: 'imgs/',
			    thumb_src: 'imgs/bus.png',
			    thumb_width: 60,
			    thumb_height: 30,
			    caption: 'Ð¢Ñ€Ð°Ð¼-Ð¿Ð°Ñ€Ð°Ð¼!'
			};
 
			var result = template.supplant(data);
 
			document.getElementById('root').innerHTML = result;	
		</script>
 
	</body>
</html>