使用非html5实现js板连连看游戏示例代码


Posted in Javascript onSeptember 22, 2013

向大家分享一款如何实现js版连连看游戏,如下图所示:

首先看一下html的布局方式在index.html文件中:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
<title>连连看</title> 
<link rel="stylesheet" type="text/css" href="css/index.css"/> 
</head> 
<body> 
<center> 
<div id="whole"> 
<div id="gamePanel" tabindex="0"> 
<div id="pieces"> 
</div> 
</div> 
<div id="gameLogo"> 
</div> 
<div id="scorePanel"> 
<span>分 数</span> 
</div> 
<div id="score"> 
<span>0</span> 
</div> 
<div id="timePanel"> 
<span>时 间</span> 
</div> 
<div id="time"> 
<span>0</span> 
</div> 
<div id="button"> 
<input id="start" type="button" onclick="Start();" value="开始"></input> 
<input id="reset" type="button" onclick="Reset();"value="重置"></input> 
</div> 
</div> 
</center> 
<script type="text/javascript" src="js/map.js"></script> 
<script type="text/javascript" src="js/piece.js"></script> 
<script type="text/javascript" src="js/game.js"></script> 
</body> 
</html>

css文件夹下的index.css文件如下:
body { font-size : 16px; 
font-weight : bold; 
color : grey; 
} 
#whole { 
border : 1px double #999999; 
border-width : 5px; 
width : 800px; 
height : 505px; 
position : relative; 
} 
#gamePanel { 
margin: 1px 1px 1px 1px; 
width : 602px; 
height : 502px; 
background : url(../img/background.gif) repeat; 
position : absolute; 
} 
#pieces { 
margin-top : 35px; 
border : 1px solid #999999; 
width : 546px; 
height : 434px; 
position: relative; 
} 
#pieces .piece { 
width : 32px; 
height : 36px; 
position : relative; 
cursor : pointer; 
float : left; 
} 
#pieces .track { 
width : 32px; 
height : 36px; 
position : relative; 
float : left; 
} 
#pieces .track2 { 
width : 32px; 
height : 36px; 
position : relative; 
float : left; 
background : red; 
} 
#gameLogo { 
margin-top : 60px; 
border : 1px solid #999999; 
left : 607px; 
width : 187px; 
height : 73px; 
background : url(../img/logo.gif); 
position: absolute; 
} 
#scorePanel { 
border : 1px solid #999999; 
left : 607px; 
top : 200px; 
width : 187px; 
height : 30px; 
position : absolute; 
} 
#score { 
border : 1px solid #999999; 
left : 607px; 
top : 240px; 
width : 187px; 
height : 30px; 
position : absolute; 
} 
#timePanel { 
border : 1px solid #999999; 
left : 607px; 
top : 300px; 
width : 187px; 
height : 30px; 
position : absolute; 
} 
#time { 
border : 1px solid #999999; 
left : 607px; 
top : 340px; 
width : 187px; 
height : 30px; 
position : absolute; 
} 
#button { 
border : 1px solid #999999; 
left : 607px; 
top : 400px; 
width : 187px; 
height : 30px; 
position : absolute; 

}

下面让我们来看一下最核心的js部分实现代码,js部分分为三个源文件即game.js、map.js、piece.js每一个源文件对应一个类,其中本游戏通过game类来操纵map和图片piece对象:

game.js代码如下:

// 游戏控制类 
var Game = { // 游戏背景 
gamePanel : null, 
// 分数 
score : 0, 
// 时间 
time : 0, 
// 图片映射表 
pieceMap : null, 
// 图片列表 
pieceList : [], 
// 图片列表不包含图片 
pieceImgList : [], 
// 图片随机数列表 
randomList : [], 
// 轨迹列表 
trackList : [], 
// 游戏是否开始 
isGameBigin : false, 
// 游戏是否结束 
isGameOver : false, 
// 游戏是否重置 
isGameReset : false, 
// 图片元素是否第一次点击 
isFirstClick : true, 
// 开始游戏 
start : function() { 
document.getElementById("start").disabled = true; 
document.getElementById("reset").disabled = false; 
if (this.isGameReset) { 
this.isGameOver = false; 
this.startTime(); 
return; 
} else if (this.isGameBegin) { 
return; 
} else { 
this.init(); 
return; 
} 
}, 
reset : function() { 
document.getElementById("start").disabled = false; 
document.getElementById("reset").disabled = true; 
this.clear(); 
this.initPieces(); 
this.initImgPieces(); 
this.time = 0; 
document.getElementById("time").innerHTML = 0; 
this.score = 0; 
document.getElementById("score").innerHTML = 0; 
this.isGameReset = true; 
this.isGameBegin = true; 
}, 
// 初始化 
init : function() { 
if (this.isGameBegin) { 
return; 
} 
this.pieceMap = new Map(); 
var _this = this; 
this.time = 0; 
this.startTime(); 
this.gamePanel = document.getElementById("pieces"); 
this.initPieces(); 
this.initImgPieces(); 
this.isGameBegin = true; 
}, 
// 将随机生成的150张图片添加进画布 
initPieces : function() { 
var _this = this; 
this.initRandomList(); 
// 打乱随机列表排序 
this.messRandomList(); 
for (var i = 0; i < 204; i ++) { 
var piece = new Piece(this); 
this.pieceList.push(piece); 
var x = (i%17); 
var y = Math.floor(i/17); 
this.pieceMap.put(x+","+y, piece); 
piece.setPosition(x, y); 
this.gamePanel.appendChild(piece.dom); 
if (x == 0 || x == 16 || y == 0 || y == 11) { 
piece.track = document.createElement("div"); 
piece.track.className = "track"; 
piece.dom.appendChild(piece.track); 
piece.isTracked = true; 
continue; 
} else { 
if (x == 1 || x == 15 || y == 1 || y == 10) { 
piece.setAtEdge(true); 
} 
this.pieceImgList.push(piece); 
} 
} 
}, 
// 初始化图片 
initImgPieces : function() { 
for (var i = 0; i < this.pieceImgList.length; i ++) { 
this.pieceImgList[i].initImg(); 
this.pieceImgList[i].img.src = "img/pieces/"+this.randomList[i]+".gif" 
this.pieceImgList[i].setImgSrc(this.pieceImgList[i].img.src); 
// 执行图片点击事件 
this.pieceImgList[i].onClick(); 
} 
}, 
// 初始化随机表 
initRandomList : function() { 
// 获取随机数列,成双出现 
for (var i = 0; i < 75; i ++) { 
var random = parseInt(Math.random()*22*10000, 10); 
var number = random%23; 
this.randomList.push(number); 
this.randomList.push(number); 
} 
}, 
// 打乱随机表 
messRandomList : function() { 
for (var i = 0; i < this.randomList.length; i ++) { 
var random = parseInt(Math.random()*15*10000, 10); 
var number = random%150; 
var temp; 
temp = this.randomList[i]; 
this.randomList[i] = this.randomList[number]; 
this.randomList[number] = temp; 
} 
}, 
// 开始计时 
startTime : function() { 
var _this = this; 
if (this.isGameOver) { 
return; 
} else { 
this.time ++; 
document.getElementById("time").innerHTML = this.time; 
this.isGameBegin = true; 
setTimeout(function() {_this.startTime();}, 1000); 
} 
}, 
// 清除 
clear : function() { 
for (var i = 0; i < this.pieceList.length; i ++) { 
this.gamePanel.removeChild(this.pieceList[i].dom); 
} 
this.pieceList = []; 
this.randomList = []; 
this.pieceImgList = []; 
this.isGameOver = true; 
this.isGameBegin = false; 
} 
} 
window.onload = function() { 
document.getElementById("start").disabled = false; 
document.getElementById("reset").disabled = true; 
} 
// 游戏开始入口 
function Start() { 
Game.start(); 
} 
// 游戏重置入口 
function Reset() { 
Game.reset(); 
}

自定义的js版映射结构map.js源文件如下:
var Map = function(){ this.data = []; 
} 
Map.prototype = { 
put : function(key, value) { 
this.data[key] = value; 
}, 
get : function(key) { 
return this.data[key]; 
}, 
remove : function(key) { 
this.data[key] = null; 
}, 
isEmpty : function() { 
return this.data.length == 0; 
}, 
size : function() { 
return this.data.length; 
} 
}

图片类piece.js源文件如下:
var Piece = function(game) { // 游戏对象 
this.game = game; 
// 是否为边缘元素 
this.isEdge = false; 
// 是否挨着边缘元素 
this.atEdge = false; 
// 图片dom元素 
this.dom = null; 
// 图片元素 
this.img = null; 
// 图片元素来源 
this.src = null; 
// 轨迹元素 
this.track = null; 
// 是否可以作为轨迹 
this.isTracked = false; 
// 选中标记元素 
this.selected = null; 
// 图片横向排列 
this.x = 0; 
// 图片纵向排列 
this.y = 0; 
// 图片闪烁Id 
this.flashId = null; 
// 图片是否点击 
this.onClicked = false; 
// 闪烁次数 
this.flashCount = 0; 
this.init(); 
} 
Piece.prototype = { 
// 初始化 
init : function() { 
this.dom = document.createElement("div"); 
this.dom.className = "piece"; 
this.selected = document.createElement("img"); 
}, 
// 初始化图片 
initImg : function() { 
this.img = document.createElement("img"); 
this.dom.appendChild(this.img); 
}, 
// 满足算法后初始化track元素 
initTrack : function() { 
if (this.flashId != null) { 
// 停止闪烁 
this.stopFlash(); 
} 
//alert("initTrack middle"); 
if (this.track != null) { 
return; 
} 
this.onClicked = false; 
this.dom.removeChild(this.img); 
this.track = document.createElement("div"); 
this.track.className = "track"; 
this.dom.appendChild(this.track); 
}, 
// 位图片设置来源 
setImgSrc : function(src) { 
this.src = src; 
}, 
// 为图片设置二维排列位置 
setPosition : function(x, y) { 
this.x = x; 
this.y = y; 
}, 
// 为图片设置选中元素 
setSelected : function() { 
if (this.flashCount ++ % 2 == 0) { 
//this.dom.removeChild(this.img); 
//this.selected.src = "img/selected.gif"; 
//this.dom.appendChild(this.selected); 
this.img.src = "img/pieces/flash.gif"; 
} else { 
//if (this.selected != null) { 
// this.dom.removeChild(this.selected); 
//} 
this.img.src = this.src; 
//this.dom.appendChild(this.img); 
} 
}, 
// 设置是否为边缘元素 
setEdge : function(isEdge) { 
this.isEdge = isEdge; 
}, 
// 设置是否挨着边缘元素 
setAtEdge : function(atEdge) { 
this.atEdge = atEdge; 
}, 
// 开始闪烁 
flash : function() { 
var _this = this; 
this.flashId = setInterval(function() {_this.setSelected();}, 500); 
}, 
// 停止闪烁 
stopFlash : function() { 
clearInterval(this.flashId); 
if (this.flashCount % 2 == 1) { 
//if (this.selected != null) { 
// this.dom.removeChild(this.selected); 
//} 
this.img.src = this.src; 
//this.dom.appendChild(this.img); 
} 
}, 
// 对象被选择的内部函数 
onClick : function() { 
if (this.onClicked) { 
return; 
} 
var _this = this; 
this.img.onclick = function() { 
if (!document.getElementById("start").disabled) { 
return; 
} 
if (_this.onClicked) { 
return; 
} 
if (_this.checkPiece()) { 
return; 
} 
_this.flash(); 
_this.onClicked = true; 
}; 
}, 
// 检查是否有被点击的图片 
checkPiece : function() { 
for (var i = 0; i < this.game.pieceList.length; i ++) { 
if (this.game.pieceList[i].onClicked && !this.game.pieceList[i].equal(this)) { 
if (this.game.pieceList[i].equalImage(this)) { 
//alert("The same Image"); 
this.searchTrack(this.game.pieceList[i]); 
} else { 
this.game.pieceList[i].stopFlash(); 
this.game.pieceList[i].onClicked = false; 
this.onClicked = false; 
return false; 
} 
return true; 
} else { 
continue; 
} 
} 
return false; 
}, 
// 是否为同一个对象 
equal : function(piece) { 
return (this.x == piece.x && this.y == piece.y); 
}, 
// 是否为同一个图片 
equalImage : function(piece) { 
return this.src == piece.src; 
}, 
// 搜寻路径 
searchTrack : function(piece) { 
if (this.isNear(piece)) { 
this.linkTrack(piece); 
return; 
} 
if (this.isReach(piece) || this.isReach2(piece)) { 
this.linkTrack(piece); 
return; 
} 
}, 
// 是否相邻 
isNear : function(piece) { 
var a = (Math.abs(piece.x - this.x) == 1) && (piece.y == this.y) 
|| (Math.abs(piece.y - this.y) == 1) && (piece.x == this.x); 
return a; 
}, 
// 直线 
isStraightReach : function(piece) { 
//alert("isStraightReach"); 
if (this.isNear(piece)) { 
return true; 
} 
var a = false; 
var b = false; 
// 沿y轴方向搜索 
if (this.x == piece.x) { 
//alert("!!!!!!!!!!!"); 
for (var i = this.min(this.y, piece.y) + 1; i < this.max(this.y, piece.y); i ++) { 
//alert("this.x == piece.x: " + piece.x + "," + i); 
if (this.game.pieceMap.get(piece.x + "," + i).isPass()) { 
a = true; 
this.game.trackList.push(this.game.pieceMap.get(piece.x + "," + i)); 
continue; 
} else { 
a = false; 
this.game.trackList = []; 
return a; 
} 
} 
} 
// 沿x轴方向搜索 
if (this.y == piece.y) { 
//alert("!!!!!!!!!!!"); 
for (var i = this.min(this.x, piece.x) + 1; i < this.max(this.x, piece.x); i ++) { 
//alert("this.y == piece.y: " + i + "," + piece.y); 
if (this.game.pieceMap.get(i + "," + piece.y).isPass()) { 
b = true; 
this.game.trackList.push(this.game.pieceMap.get(i + "," + piece.y)); 
continue; 
} else { 
b = false 
this.game.trackList = []; 
return b; 
} 
} 
} 
return a || b; 
}, 

// 拐一次弯搜索 
isReach1 : function(piece) { 
//alert("isReach1"); 
var corner_1 = this.game.pieceMap.get(this.x + "," + piece.y); 
var corner_2 = this.game.pieceMap.get(piece.x + "," + this.y); 
var _this = this; 

if ((_this.isStraightReach(corner_1)) 
&& (corner_1.isStraightReach(piece)) 
&& corner_1.isPass()) { 
//alert("corner_1: " + this.x + "," + piece.y); 
this.game.trackList.push(corner_1); 
return true; 
} 
if ((_this.isStraightReach(corner_2)) 
&& (corner_2.isStraightReach(piece)) 
&& corner_2.isPass()) { 
//alert("corner_2: " + piece.x + "," + this.y); 
this.game.trackList.push(corner_2); 
return true; 
} 
return false; 
}, 
// 直接或拐一次弯搜索 
isReach : function(piece) { 
var a = this.isStraightReach(piece); 
var b = this.isReach1(piece); 
return a || b; 
}, 
// 拐两次弯搜索 
isReach2 : function(piece) { 
// 沿x轴正向搜索 
for (var i = this.x + 1; i < 17; i ++) { 
if (!this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(i + "," + this.y).isReach(piece) 
&& this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(i + "," + this.y)); 
return true; 
} 
} 
// 沿x轴搜索 
for (var i = this.x - 1; i >= 0; i --) { 
if (!this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(i + "," + this.y).isReach(piece) 
&& this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(i + "," + this.y)); 
return true; 
} 
} 
// 沿y轴搜索 
for (var i = this.y - 1; i >= 0; i --) { 
if (!this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(this.x + "," + i).isReach(piece) 
&& this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(this.x + "," + i)); 
return true; 
} 
} 
// 沿y轴正向搜索 
for (var i = this.y + 1; i < 12; i ++) { 
if (!this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(this.x + "," + i).isReach(piece) 
&& this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(this.x + "," + i)); 
return true; 
} 
} 
return false; 
}, 
// 路径连接 
linkTrack : function(piece) { 
this.initTrack(); 
piece.initTrack(); 
this.changeScore(); 
this.showTrack(piece); 
}, 
// 显示足迹 
showTrack : function(piece) { 
this.game.trackList.push(piece); 
this.track.className = "track2"; 
for (var i = 0; i < this.game.trackList.length; i ++) { 
//alert(i); 
this.game.trackList[i].track.className = "track2"; 
} 
var _this = this; 
setTimeout(function() {_this.hideTrack()}, 500); 
}, 
// 隐匿足迹 
hideTrack : function() { 
for (var i = 0; i < this.game.trackList.length; i ++) { 
this.game.trackList[i].track.className = "track"; 
} 
this.game.trackList = []; 
this.track.className = "track"; 
this.isTracked = true; 
}, 
// 分数增加 
changeScore : function() { 
this.game.score += 100; 
document.getElementById("score").innerHTML = this.game.score; 
}, 
min : function(a, b) { 
if (a < b) { 
return a; 
} else { 
return b; 
} 
}, 
max : function(a, b) { 
if (a > b) { 
return a; 
} else { 
return b; 
} 
}, 
// 判断是否通过 
isPass : function() { 
return this.track != null; 
} 
}

以上是源文件的代码,具体的实现代码请关注CSDN中zhangjinpeng66下载。下面讲一下连连看游戏最核心的部分,js实现搜索路径。

js实现搜索路径算法首先最简单的是判断两个图片能否直线到达函数代码如下:

// 直线 
isStraightReach : function(piece) { 
//alert("isStraightReach"); 
if (this.isNear(piece)) { return true; 
} 
var a = false; 
var b = false; 
// 沿y轴方向搜索 
if (this.x == piece.x) { 
//alert("!!!!!!!!!!!"); 
for (var i = this.min(this.y, piece.y) + 1; i < this.max(this.y, piece.y); i ++) { 
//alert("this.x == piece.x: " + piece.x + "," + i); 
if (this.game.pieceMap.get(piece.x + "," + i).isPass()) { 
a = true; 
this.game.trackList.push(this.game.pieceMap.get(piece.x + "," + i)); 
continue; 
} else { 
a = false; 
this.game.trackList = []; 
return a; 
} 
} 
} 
// 沿x轴方向搜索 
if (this.y == piece.y) { 
//alert("!!!!!!!!!!!"); 
for (var i = this.min(this.x, piece.x) + 1; i < this.max(this.x, piece.x); i ++) { 
//alert("this.y == piece.y: " + i + "," + piece.y); 
if (this.game.pieceMap.get(i + "," + piece.y).isPass()) { 
b = true; 
this.game.trackList.push(this.game.pieceMap.get(i + "," + piece.y)); 
continue; 
} else { 
b = false 
this.game.trackList = []; 
return b; 
} 
} 
} 
return a || b; 
},

该函数实现了连连看判断两图片是否符合连接条件的最简单的一步,然后是拐一次弯搜索。
// 拐一次弯搜索 
isReach1 : function(piece) { 
//alert("isReach1"); 
var corner_1 = this.game.pieceMap.get(this.x + "," + piece.y); 
var corner_2 = this.game.pieceMap.get(piece.x + "," + this.y); var _this = this; 

if ((_this.isStraightReach(corner_1)) 
&& (corner_1.isStraightReach(piece)) 
&& corner_1.isPass()) { 
//alert("corner_1: " + this.x + "," + piece.y); 
this.game.trackList.push(corner_1); 
return true; 
} 
if ((_this.isStraightReach(corner_2)) 
&& (corner_2.isStraightReach(piece)) 
&& corner_2.isPass()) { 
//alert("corner_2: " + piece.x + "," + this.y); 
this.game.trackList.push(corner_2); 
return true; 
} 
return false; 
},

在拐一次弯搜索的函数中调用了直接搜索的函数,同样最复杂的拐两次弯搜索也会调用拐一次弯搜索的函数。
// 拐两次弯搜索 
isReach2 : function(piece) { // 沿x轴正向搜索 
for (var i = this.x + 1; i < 17; i ++) { 
if (!this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(i + "," + this.y).isReach(piece) 
&& this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(i + "," + this.y)); 
return true; 
} 
} 
// 沿x轴搜索 
for (var i = this.x - 1; i >= 0; i --) { 
if (!this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(i + "," + this.y).isReach(piece) 
&& this.game.pieceMap.get(i + "," + this.y).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(i + "," + this.y)); 
return true; 
} 
} 
// 沿y轴搜索 
for (var i = this.y - 1; i >= 0; i --) { 
if (!this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(this.x + "," + i).isReach(piece) 
&& this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(this.x + "," + i)); 
return true; 
} 
} 
// 沿y轴正向搜索 
for (var i = this.y + 1; i < 12; i ++) { 
if (!this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList = []; 
break; 
} else if (this.game.pieceMap.get(this.x + "," + i).isReach(piece) 
&& this.game.pieceMap.get(this.x + "," + i).isPass()) { 
this.game.trackList.push(this.game.pieceMap.get(this.x + "," + i)); 
return true; 
} 
} 
return false; 
},

该函数以点击的图片为中心分别沿x轴,y轴展开搜索。
以上是本游戏代码的全部内容。具体游戏源码请到CSDN中zhangjinpeng66的资源里下载。
Javascript 相关文章推荐
[原创]保存的js无法执行的解决办法
Feb 25 Javascript
JS阻止冒泡事件以及默认事件发生的简单方法
Jan 17 Javascript
javascript:json数据的页面绑定示例代码
Jan 26 Javascript
JQuery中使用Ajax赋值给全局变量失败异常的解决方法
Aug 18 Javascript
jquery 设置style:display的方法
Jan 29 Javascript
简介AngularJS的视图功能应用
Jun 17 Javascript
asp.net中oracle 存储过程(图文)
Aug 12 Javascript
jQuery实现百叶窗焦点图动画效果代码分享(附源码下载)
Mar 14 Javascript
关于验证码在IE中不刷新的快速解决方法
Sep 23 Javascript
实例详解JavaScript中setTimeout函数的执行顺序
Jul 12 Javascript
jquery tmpl模板(实例讲解)
Sep 02 jQuery
react.js 父子组件数据绑定实时通讯的示例代码
Sep 25 Javascript
非html5实现js版弹球游戏示例代码
Sep 22 #Javascript
多种方法判断Javascript对象是否存在
Sep 22 #Javascript
利用毫秒减值计算时长的js代码
Sep 22 #Javascript
js获取多个tagname的节点数组
Sep 22 #Javascript
jQuery中校验时间格式的正则表达式小结
Sep 22 #Javascript
jquery中获取id值方法小结
Sep 22 #Javascript
document.getElementBy(&quot;id&quot;)与$(&quot;#id&quot;)有什么区别
Sep 22 #Javascript
You might like
第一节--面向对象编程
2006/11/16 PHP
php安全配置 如何配置使其更安全
2011/12/16 PHP
php使用ob_flush不能每隔一秒输出原理分析
2015/06/02 PHP
php入门教程之Zend Studio设置与开发实例
2016/09/09 PHP
Laravel接收前端ajax传来的数据的实例代码
2017/07/20 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
购物车实现的几种方式优缺点对比
2018/05/02 PHP
php处理多图上传压缩代码功能
2018/06/13 PHP
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
2007/08/31 Javascript
解决火狐浏览器下JS setTimeout函数不兼容失效不执行的方法
2012/11/14 Javascript
JS添加删除一组文本框并对输入信息加以验证判断其正确性
2013/04/11 Javascript
javascript中数组中求最大值示例代码
2013/12/18 Javascript
js判断60秒以及倒计时示例代码
2014/01/24 Javascript
简单纯js实现点击切换TAB标签实例
2015/08/23 Javascript
JavaScript中的操作符类型转换示例总结
2016/05/30 Javascript
搭建Bootstrap离线文档的方法
2016/12/02 Javascript
纯js模仿windows系统日历
2017/02/04 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
微信小程序按钮去除边框线分享页面功能
2018/08/27 Javascript
利用百度echarts实现图表功能简单入门示例【附源码下载】
2019/06/10 Javascript
node中使用log4js4.x版本记录日志的方法
2019/08/20 Javascript
在layui中select更改后生效的方法
2019/09/05 Javascript
Vue中keep-alive组件作用详解
2020/02/04 Javascript
Vue.js获取手机系统型号、版本、浏览器类型的示例代码
2020/05/10 Javascript
使用python提取html文件中的特定数据的实现代码
2013/03/24 Python
Python最长公共子串算法实例
2015/03/07 Python
在Python中调用ggplot的三种方法
2015/04/08 Python
python简单实现刷新智联简历
2016/03/30 Python
解析Mac OS下部署Pyhton的Django框架项目的过程
2016/05/03 Python
Python实现代码统计工具(终极篇)
2016/07/04 Python
tensorflow入门之训练简单的神经网络方法
2018/02/26 Python
世界上最大的在线旅行社新加坡网站:Expedia新加坡
2016/08/25 全球购物
英国绿色商店:Natural Collection
2019/05/03 全球购物
公司开业庆典主持词
2014/03/21 职场文书
关于保护环境的建议书
2014/05/13 职场文书
奖学金申请书(范文)
2019/08/14 职场文书