Return to Snippet

Revision: 23672
at February 11, 2010 04:53 by vissper


Updated Code
<!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>

Revision: 23671
at February 11, 2010 04:53 by vissper


Updated Code
<!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>

Revision: 23670
at February 11, 2010 04:50 by vissper


Initial Code
<!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>

Initial URL

                                

Initial Description
[Источник](http://sreznikov.blogspot.com/2010/01/supplant.html)

Initial Title
Simple template

Initial Tags
javascript, template

Initial Language
HTML