想当年,为了研究五子棋各个语言版本,我就熬了几个通宵,写出了一个经典的javascript版本五子棋游戏

YouYaX 发布于 2013/11/06 19:30
阅读 318
收藏 2

现在也不搞javascript游戏了,特此倾囊传授给需要的人

<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style>
    *{
    margin:0;
    padding:0;
    }
    #main{
    width:502px;
    height:502px;
    border-top:#555 solid 1px;
    border-right:#555 solid 1px;
    background-color:#eb9c5d;
    margin:0px auto;
    position:absolute;
    left:220px;
    z-index:1;
    }
    #main .div{
    width:19px;
    height:19px;
    border-bottom:#d2691e solid 1px;
    border-left:#d2691e solid 1px;
    float:left;
    display:inline;
    line-height:19px;
    }
    #main2{
    position:absolute;
    left:220px;
    z-index:2;
    padding:10px;
    width:480px;
    height:480px;
    }
    #main2 span{
    width:20px;
    height:20px;
    display:block;
    float:left;
    cursor:pointer;
    line-height:20px;
    font-size:1px;
    }
    #main2 span.wb{
    background:url(./images/heiqi.gif) no-repeat;/*黑旗*/
    }
    #main2 span.bb{
    background:url(./images/baiqi.gif) no-repeat;/*白旗*/
    }
     #main2 span.clear{
   		/*清空*/
    }
    #aa{
    text-align:center;
    margin-left:-80px;
    height:36px;
    line-height:36px;
    font-family:Tahoma;
    font-weight:700;
    font-size:16px;
    }
    </style>
    <script type="text/javascript" language="javascript">
    function $(o){
    return document.getElementById(o);
    }
    var flag=0;
    var black="黑方";
    var witer="白方";		
    var check=new Array(0,0,0,0,0,0,0,0);
    function played(){
    var piece=$("main2").getElementsByTagName("span");
    for(var i=0;i<piece.length;i++){
    piece[i].onclick = function(){
    showPieces(this);
  	
  	for(var j=0;j<24;j++)
  	{
   		for(var k=0;k<24;k++)
   		{
					if(piece[k+24*j].className == "bb" && piece[k+1+24*j].className == "bb" && piece[k+2+24*j].className == "bb"
                  && piece[k+3+24*j].className == "bb" && piece[k+4+24*j].className == "bb"/* ||
                piece[k+24*j].className == "bb" && piece[k-1+24*j].className == "bb" && piece[k-2+24*j].className == "bb"
                  && piece[k-3+24*j].className == "bb" && piece[k-4+24*j].className == "bb" ||
                 piece[k+24*j].className == "bb" && piece[k-2+24*j].className == "bb" && piece[k+2+24*j].className == "bb"
                  && piece[k+3+24*j].className == "bb" && piece[k+4+24*j].className == "bb" ||
                piece[k+24*j].className == "bb" && piece[k+1+24*j].className == "bb" && piece[k-1+24*j].className == "bb"
                  && piece[k-2+24*j].className == "bb" && piece[k-3+24*j].className == "bb" ||
                piece[k+24*j].className == "bb" && piece[k-1+24*j].className == "bb" && piece[k+1+24*j].className == "bb"
                  && piece[k-2+24*j].className == "bb" && piece[k+2+24*j].className == "bb"*/
               )
   				{
   					alert("白棋获胜");//横向白旗获胜
   					check[0]=1;
   					break;
   				}
   				if(piece[k+24*j].className == "wb" && piece[k+1+24*j].className == "wb" && piece[k+2+24*j].className == "wb"
                  && piece[k+3+24*j].className == "wb" && piece[k+4+24*j].className == "wb"/* ||
                piece[k+24*j].className == "wb" && piece[k-1+24*j].className == "wb" && piece[k-2+24*j].className == "wb"
                  && piece[k-3+24*j].className == "wb" && piece[k-4+24*j].className == "wb" ||
                 piece[k+24*j].className == "wb" && piece[k-2+24*j].className == "wb" && piece[k+2+24*j].className == "wb"
                  && piece[k+3+24*j].className == "wb" && piece[k+4+24*j].className == "wb" ||
                piece[k+24*j].className == "wb" && piece[k+1+24*j].className == "wb" && piece[k-1+24*j].className == "wb"
                  && piece[k-2+24*j].className == "wb" && piece[k-3+24*j].className == "wb" ||
                piece[k+24*j].className == "wb" && piece[k-1+24*j].className == "wb" && piece[k+1+24*j].className == "wb"
                  && piece[k-2+24*j].className == "wb" && piece[k+2+24*j].className == "wb"*/
               )
   				{
   					alert("黑棋获胜");//横向黑旗获胜
   					check[1]=1;
   					break;
   				}
   				if (piece[k+24*j].className == "bb" && piece[k+24*1+24*j].className == "bb" && piece[k+24*2+24*j].className == "bb"
                      && piece[k+24*3+24*j].className == "bb" && piece[k+24*4+24*j].className == "bb" /*||
                    piece[k+24*j].className == "bb" && piece[k-24*1+24*j].className == "bb" && piece[k-24*2+24*j].className == "bb"
                      && piece[k-24*3+24*j].className == "bb" && piece[k-24*4+24*j].className == "bb" ||
                     piece[k+24*j].className == "bb" && piece[k-24*1+24*j].className == "bb" && piece[k+24*1+24*j].className == "bb"
                      && piece[k+24*2+24*j].className == "bb" && piece[k+24*3+24*j].className == "bb" ||
                    piece[k+24*j].className == "bb" && piece[k+24*1+24*j].className == "bb" && piece[k-24*1+24*j].className == "bb"
                      && piece[k-24*2+24*j].className == "bb" && piece[k-24*3+24*j].className == "bb" ||
                    piece[k+24*j].className == "bb" && piece[k-24*1+24*j].className == "bb" && piece[k+24*1+24*j].className == "bb"
                      && piece[k-24*2+24*j].className == "bb" && piece[k+24*2+24*j].className == "bb"*/
                    )
         {
   					alert("白棋获胜");//纵向白旗获胜
   					check[2]=1;
   					break;
   				}
   			if (piece[k+24*j].className == "wb" && piece[k+24*1+24*j].className == "wb" && piece[k+24*2+24*j].className == "wb"
                      && piece[k+24*3+24*j].className == "wb" && piece[k+24*4+24*j].className == "wb"/* ||
                    piece[k+24*j].className == "wb" && piece[k-24*1+24*j].className == "wb" && piece[k-24*2+24*j].className == "wb"
                      && piece[k-24*3+24*j].className == "wb" && piece[k-24*4+24*j].className == "wb" ||
                     piece[k+24*j].className == "wb" && piece[k-24*1+24*j].className == "wb" && piece[k+24*1+24*j].className == "wb"
                      && piece[k+24*2+24*j].className == "wb" && piece[k+24*3+24*j].className == "wb" ||
                    piece[k+24*j].className == "wb" && piece[k+24*1+24*j].className == "wb" && piece[k-24*1+24*j].className == "wb"
                      && piece[k-24*2+24*j].className == "wb" && piece[k-24*3+24*j].className == "wb" ||
                    piece[k+24*j].className == "wb" && piece[k-24*1+24*j].className == "wb" && piece[k+24*1+24*j].className == "wb"
                      && piece[k-24*2+24*j].className == "wb" && piece[k+24*2+24*j].className == "wb"*/
                    )
         {
   					alert("黑棋获胜");//纵向黑旗获胜
   					check[3]=1;
   					break;
   				}
   			if (/*piece[k+24*j].className == "bb" && piece[k-24*1+1+24*j].className == "bb" && piece[k-24*2+2+24*j].className == "bb"
                         && piece[k-24*3+3+24*j].className == "bb" && piece[k-24*4+4+24*j].className == "bb" ||*/
                       piece[k+24*j].className == "bb" && piece[k+24*1-1+24*j].className == "bb" && piece[k+24*2-2+24*j].className == "bb"
                         && piece[k+24*3-3+24*j].className == "bb" && piece[k+24*4-4+24*j].className == "bb" /*||
                        piece[k+24*j].className == "bb" && piece[k+24*1-1+24*j].className == "bb" && piece[k-24*1+1+24*j].className == "bb"
                         && piece[k-24*2+2+24*j].className == "bb" && piece[k-24*3+3+24*j].className == "bb" ||
                       piece[k+24*j].className == "bb" && piece[k-24*1+1+24*j].className == "bb" && piece[k+24*1-1+24*j].className == "bb"
                         && piece[k+24*2-2+24*j].className == "bb" && piece[k+24*3-3+24*j].className == "bb" ||
                       piece[k+24*j].className == "bb" && piece[k+24*1-1+24*j].className == "bb" && piece[k-24*1+1+24*j].className == "bb"
                         && piece[k+24*2-2+24*j].className == "bb" && piece[k-24*2+2+24*j].className == "bb"*/
                       )
         {
   					alert("白棋获胜");//左斜向白旗获胜
   					check[4]=1;
   					break;
   				}
   				if (/*piece[k+24*j].className == "wb" && piece[k-24*1+1+24*j].className == "wb" && piece[k-24*2+2+24*j].className == "wb"
                         && piece[k-24*3+3+24*j].className == "wb" && piece[k-24*4+4+24*j].className == "wb" ||*/
                       piece[k+24*j].className == "wb" && piece[k+24*1-1+24*j].className == "wb" && piece[k+24*2-2+24*j].className == "wb"
                         && piece[k+24*3-3+24*j].className == "wb" && piece[k+24*4-4+24*j].className == "wb" /*||
                        piece[k+24*j].className == "wb" && piece[k+24*1-1+24*j].className == "wb" && piece[k-24*1+1+24*j].className == "wb"
                         && piece[k-24*2+2+24*j].className == "wb" && piece[k-24*3+3+24*j].className == "wb" ||
                       piece[k+24*j].className == "wb" && piece[k-24*1+1+24*j].className == "wb" && piece[k+24*1-1+24*j].className == "wb"
                         && piece[k+24*2-2+24*j].className == "wb" && piece[k+24*3-3+24*j].className == "wb" ||
                       piece[k+24*j].className == "wb" && piece[k+24*1-1+24*j].className == "wb" && piece[k-24*1+1+24*j].className == "wb"
                         && piece[k+24*2-2+24*j].className == "wb" && piece[k-24*2+2+24*j].className == "wb"*/
                       )
         {
   					alert("黑棋获胜");//左斜向黑旗获胜
   					check[5]=1;
   					break;
   				}
   				if (piece[k+24*j].className == "bb" && piece[k+24*1+1+24*j].className == "bb" && piece[k+24*2+2+24*j].className == "bb"
                                 && piece[k+24*3+3+24*j].className == "bb" && piece[k+24*4+4+24*j].className == "bb" /*||
                               piece[k+24*j].className == "bb" && piece[k-24*1-1+24*j].className == "bb" && piece[k-24*2-2+24*j].className == "bb"
                                 && piece[k-24*3-3+24*j].className == "bb" && piece[k-24*4-4+24*j].className == "bb" ||
                                piece[k+24*j].className == "bb" && piece[k-24*1-1+24*j].className == "bb" && piece[k+24*1+1+24*j].className == "bb"
                                 && piece[k+24*2+2+24*j].className == "bb" && piece[k+24*3+3+24*j].className == "bb" ||
                               piece[k+24*j].className == "bb" && piece[k+24*1+1+24*j].className == "bb" && piece[k-24*1-1+24*j].className == "bb"
                                 && piece[k-24*2-2+24*j].className == "bb" && piece[k-24*3-3+24*j].className == "bb" ||
                               piece[k+24*j].className == "bb" && piece[k-24*1-1+24*j].className == "bb" && piece[k+24*1+1+24*j].className == "bb"
                                 && piece[k-24*2-2+24*j].className == "bb" && piece[k+24*2+2+24*j].className == "bb"*/
                               )
         {
   					alert("白棋获胜");//右斜向白旗获胜
   					check[6]=1;
   					break;
   				}
   		if (piece[k+24*j].className == "wb" && piece[k+24*1+1+24*j].className == "wb" && piece[k+24*2+2+24*j].className == "wb"
                                 && piece[k+24*3+3+24*j].className == "wb" && piece[k+24*4+4+24*j].className == "wb" /*||
                               piece[k+24*j].className == "wb" && piece[k-24*1-1+24*j].className == "wb" && piece[k-24*2-2+24*j].className == "wb"
                                 && piece[k-24*3-3+24*j].className == "wb" && piece[k-24*4-4+24*j].className == "wb" ||
                                piece[k+24*j].className == "wb" && piece[k-24*1-1+24*j].className == "wb" && piece[k+24*1+1+24*j].className == "wb"
                                 && piece[k+24*2+2+24*j].className == "wb" && piece[k+24*3+3+24*j].className == "wb" ||
                               piece[k+24*j].className == "wb" && piece[k+24*1+1+24*j].className == "wb" && piece[k-24*1-1+24*j].className == "wb"
                                 && piece[k-24*2-2+24*j].className == "wb" && piece[k-24*3-3+24*j].className == "wb" ||
                               piece[k+24*j].className == "wb" && piece[k-24*1-1+24*j].className == "wb" && piece[k+24*1+1+24*j].className == "wb"
                                 && piece[k-24*2-2+24*j].className == "wb" && piece[k+24*2+2+24*j].className == "wb"*/
                               )
         {
   					alert("黑棋获胜");//右斜向黑旗获胜
   					check[7]=1;
   					break;
   				}
   		}
   		
   		if(check[0]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[1]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[2]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[3]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[4]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[5]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[6]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   		if(check[7]==1)
   		{
   			for(y=0;y<576;y++)
   			{
   				piece[y].className="clear";
   			}
   			for(x=0;x<8;x++)
   			{
   				check[x]=0;
   			}
   			break;
   		}
   	}
    
    return false
    }
    }
    }
    function showPieces(t){
    if(t.className!="wb" && t.className!="bb"){
    if(flag==0){
    t.className="wb"
    flag=1;
    panduan(witer)
    }else{
    t.className="bb"
    flag=0;
    panduan(black)
    }
    }
    }
    function panduan(te){
    $("aa").innerHTML="当前执棋:"+te
    }
    </script>
    </head>
    <body bgcolor="#fafafa">
    <div id="aa"></div>
    <div id="main"></div>
    <div id="main2"></div>
    <script type="text/javascript" language="javascript">
    var _div=[]
    var _span=[]
    for(i=0;i<625;i++){
    _div[i]=document.createElement("div");
    _div[i].className="div"
    $("main").appendChild(_div[i])
    }
    for(j=0;j<576;j++){
    _span[j]=document.createElement("span")
    $("main2").appendChild(_span[j])
    }
    panduan(black)
    played()
    </script>    
    </body>
    </html>

加载中
0
苏生不惑
苏生不惑
只能说不明觉厉
0
兮风古道
兮风古道
witer,怀特?
返回顶部
顶部