这几天一直在玩canvas，所以就想多练习下逻辑。
Document.png
99乘法表.png
- js
var div1=document.getElementById('div1');
var div2=document.getElementById('div2');
var div3=document.getElementById('div3');
var div4=document.getElementById('div4');
var div5=document.getElementById('div5');
var div6=document.getElementById('div6');
var div7=document.getElementById('div7');
var div8=document.getElementById('div8');
var div9=document.getElementById('div9');
var div10=document.getElementById('div10');
var div11=document.getElementById('div11');
var div12=document.getElementById('div12');
var div13=document.getElementById('div13');
div1.innerHTML='*<br/>*';
var str2='';
for(var a=0;a<6;a++){
str2+='* ';
}
div2.innerHTML=str2;
var str3='';
for(var b=0;b<6;b++){
str3+='*<br/>';
}
div3.innerHTML=str3;
var str4='';
for(var c=0;c<6;c++){
for(var d=0;d<6;d++){
str4+='* ';
}
str4+='<br/>';
}
div4.innerHTML=str4;
var str5='';
for(var e=0;e<6;e++){
for(var f=0;f<e+1;f++){
str5+='* ';
}
str5+='<br/>';
}
div5.innerHTML=str5;
var str6='';
for(var g=0;g<6;g++){
str6+=' ';
}
str6+='*<br/>';
div6.innerHTML=str6;
var str7='';
for(var hx=0;hx<6;hx++){
for(var h=0;h<5;h++){
str7+=' ';
}
str7+='*<br/>';
}
div7.innerHTML=str7;
var str8='';
for(var ix=0;ix<6;ix++){
for(var iz=0;iz<5-ix;iz++){
str8+='<span class="opa">* </span>';
}
for(var iy=0;iy<ix*2+1;iy++){
str8+='* ';
}
str8+='<br/>';
}
for(var jx=0;jx<5;jx++){
for(var jz=0;jz<=jx;jz++){
str8+='<span class="opa">* </span>';
}
for(var jy=0;jy<(5-jx)*2-1;jy++){
str8+='* ';
}
str8+='<br/>';
}
div8.innerHTML=str8;
var str9='';
for(var kx=0;kx<11;kx++){
for(var kspace=0;kspace<Math.abs(5-kx);kspace++){
str9+='<span class="opa">⚫ </span>';
}
if(kx<=4){
for(var ks=0;ks<2*kx+1;ks++){
str9+='⚫ ';
}
}else{
for(var ks=0;ks<3*(7-kx)+kx;ks++){
str9+='⚫ ';
}
}
str9+='<br/>';
}
div9.innerHTML=str9;
var str10='';
for(var lx=0;lx<6;lx++){
for(var lz=0;lz<5-lx;lz++){
str10+='<span class="opa">啦 </span>';
}
for(var ly=0;ly<lx*2+1;ly++){
if(ly==0 || ly==lx*2 || lx==5){
str10+='空 ';
}else{
str10+='<span class="opa">啦 </span>';
}
}
str10+='<br/>';
}
div10.innerHTML=str10;
for(var z=0;z<10;z++){
// continue后面的不会再执行了
if(z==4){
continue;
}
console.log(z);
}
var str11='';
for(var kx=0;kx<11;kx++){
for(var kspace=0;kspace<Math.abs(5-kx);kspace++){
str11+='<span class="opa">⚫ </span>';
}
if(kx<=4){
for(var ks=0;ks<2*kx+1;ks++){
if(ks==0 || ks==2*kx){
str11+='⚫ ';
}else{
str11+='<span class="opa">⚫ </span>';
}
}
}else{
for(var ks=0;ks<3*(7-kx)+kx;ks++){
if(ks==0 || ks==3*(7-kx)+kx-1){
str11+='⚫ ';
}else{
str11+='<span class="opa">⚫ </span>';
}
}
}
str11+='<br/>';
}
div11.innerHTML=str11;
var str12='';
for(var mx=0;mx<7;mx++){
if(mx<=3){
for(var mspace=0;mspace<mx;mspace++){
str12+='<span class="opa">* </span>';
}
for(var my=0;my<2*(4-mx)-1;my++){
if(mx==0 || my==0 || my==2*(4-mx)-2){
str12+='* ';
}else{
str12+='<span class="opa">* </span>';
}
}
}else{
for(var mspace=0;mspace<6-mx;mspace++){
str12+='<span class="opa">* </span>';
}
for(var my=0;my<2*(mx-4)+3;my++){
str12+='* ';
}
}
str12+='<br/>';
}
div12.innerHTML=str12;
var str13='';
for(var nx=1;nx<=9;nx++){
for(var ny=1;ny<=nx;ny++){
str13+=ny+'*'+nx+'='+nx*ny+' ';
}
str13+='<br/>';
}
div13.innerHTML=str13;
- html
<h5>一个*</h5>
<div id="div1">
</div>
<h5>一行6个*</h5>
<div id="div2">
</div>
<h5>一列6个*</h5>
<div id="div3">
</div>
<h5>6行6列</h5>
<div id="div4">
</div>
<h5>三角形1</h5>
<div id="div5">
</div>
<h5>打印6个空格，后跟星号</h5>
<div id="div6">
</div>
<h5>每行5个空格，后跟一个星号</h5>
<div id="div7">
</div>
<h5>等腰三角形 菱形</h5>
<div id="div8">
</div>
<h5>菱形2</h5>
<div id="div9">
</div>
<h5>空心金字塔</h5>
<div id="div10">
</div>
<h5>空心菱形</h5>
<div id="div11">
</div>
<h5>沙漏形</h5>
<div id="div12">
</div>
<h5>乘法表</h5>
<div id="div13">
</div>
- css(写这个是为了让空格更好看一些)
.opa{opacity: 0;}
