技術標籤：js

平行四邊形

平行四邊形最為簡單
比如繪製一個高度為5長度為10的平行四邊形
如：

注意：
①第一排1個空格  第5排5個空格
②沒列印一排要換行

分析結構
for（var i=1；i<=5 ；i++）{/ / 因為有5行
for（迴圈 i 次）{ 每行有i個空格}
直接列印十個星號
}
程式碼為：

for(var i=1;i<=5;i++){
	for(var j=1;j<=i;i++){    //每行的空格逐漸增加
				//i的值在迴圈不斷加大 j加入的空格越來越多形成一個梯度
	document.write("&emsp"
 
);  //  &emsp;中文空格
}
	document.write("* * * * * * * * * * <br>")
}

三角形

繪製三角形我們可以先分析他的結構

第1行：      空格 x 4   |     星號 x 1
第2行：      空格 x 3   |     星號 x 3
第3行：      空格 x 2   |     星號 x 5
第4行：      空格 x 1   |     星號 x 7
第5行：      空格 x 0   |     星號 x 9
						    =行數 x 2 - 1 

分析結構：	
for(var i = 1 ; i<=5 ; i++ ){   //應為有5行所以我們迴圈5次
	①for（迴圈5-i 次）{   列印 空格 }
	②for（迴圈2 x i - 1）{ 列印 星號} 
	③換行
}
程式碼為：
 

for(var i = 1 ; i<=5 ; i++ ){  
		for(var j=1;j<=5-i;j++){
            document.write("&nbsp;")
            }
		for(var j=1;j<=2*i-1;j++){ 
            document.write("*")
        } 
          document.write("<br>")
	}

菱形

菱形相當於
上面的三角形加上一個相反的三角形就是
分析
上面一個三角形
for(var i = 1 ; i<=5 ; i++ ){   //應為有5行所以我們迴圈5次

內容不變}

下面一個三角形
for(var i = 5 ; i>=1 ; i- - ){    條件相反   倒過來的三角形
			//再把5改成4 防止2重疊一條星號

內容不變}
程式碼為：
 

//上面一個三角形
for(var i = 1 ; i<=5 ; i++ ){   
		for(var j=1;j<=5-i;j++){
            document.write("&nbsp;&nbsp;")
        }
		for(var j=1;j<=2*i-1;j++){ 
            document.write("&nbsp;*")
        } 
          document.write("<br>")
    }
    //下面一個三角形
	for(var i = 4 ; i>=1 ; i-- ){  
		for(var j=1;j<=5-i;j++){
            document.write("&nbsp;&nbsp;")
        }
		for(var j=1;j<=2*i-1;j++){ 
            document.write("&nbsp;*")
        } 
          document.write("<br>")
    }