ejs模板使用笔记

2017-03-09

<% %>

被<% %>括住的内容会被ejs compiler当成javascript语句执行。使得我们可以在.ejs中使用javascript
那为什么我们不直接使用 <script>标签呢？
实际上它们存在区别，<script>中的内容本质还是你的html，也就是你点开页面view source能直接看到代码；相反，<% %>括住的内容是不会被转义成html的，它们的功能应该是辅助你书写ejs。
在<script>中使用<% %>时需要注意这点。

<%= %>

被<%= %>括住的变量会被ejs转义成变量的值输出到html中。
应当注意<%= %>不在<% %>中被使用

demo

这是我在做一个经纬度标记到高德地图上所使用的ejs代码

   <script type="text/javascript">
pos =  [ <%=results[0].Longitude%> , <%=results[0].Latitude%>];
	
       var map = new AMap.Map('container',{
           resizeEnable: true,
           zoom: 10,
		center: pos
       });
	var marker = [] ; 
	if( !<%=empty%>){
		<% for( var i = 0 ; i < results.length ; i ++ ){%>
			marker[<%=i%>] = new AMap.Marker({
				icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
				position: [ <%=results[i].Longitude%> , <%=results[i].Latitude%> ]
			});	
			marker[<%=i%>].setMap(map);
		<%;}%>
	}
   </script>

用浏览器打开view source，得到的结果是

 <script type="text/javascript">
	pos =  [ 103.89472166666667 , 30.97911];
		
        var map = new AMap.Map('container',{
            resizeEnable: true,
            zoom: 10,
			center: pos
        });
		var marker = [] ; 
		if( !false){
			
				marker[0] = new AMap.Marker({
					icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
					position: [ 103.89472166666667 , 30.97911 ]
				});	
				marker[0].setMap(map);
			
				marker[1] = new AMap.Marker({
					icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
					position: [ 103.89472166666667 , 30.97911 ]
				});	
				marker[1].setMap(map);
			
				marker[2] = new AMap.Marker({
					icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
					position: [ 103.89463833333333 , 30.9795 ]
				});	
				marker[2].setMap(map);
				
.....省略.....
}
</script>