الإصدار: IE7 FF3.0.14
<!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 ">
<الرأس>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>贪吃蛇 - بقلم CNwander</title>
<نمط النوع = "نص/CSS">
* {الهامش:0؛ الحشو:0}
الجسم {الخلفية:#333؛ -moz-user-select:none; محاذاة النص:مركز؛ حجم الخط:12px}
الجدول {الهامش: 80px تلقائي 10px تلقائي؛ تجاوز: مخفي؛ انهيار الحدود: انهيار؛ }
تد {العرض: 20px؛ الارتفاع: 20 بكسل؛ الحدود: 1px الصلبة #eee؛ الخلفية:#f4f4f4}
.الغطاء {الخلفية:#39ج;}
.الطعام {الخلفية:#093}
كتلة {الخلفية:#333}
.الفرامل {الخلفية:#f00}
.تزلج {الخلفية:#00f}
# قل {الهامش العلوي: 50px؛ اللون:أبيض}
# مساعدة {العرض: 420 بكسل؛ الهامش:0 تلقائي؛ ارتفاع الخط: 17 بكسل؛ اللون:أبيض}
#help تمتد {float:left; الهامش الأيمن:10 بكسل}
# مساعدة .مربع {العرض: 15px؛ الارتفاع: 15 بكسل؛ الهامش الأيمن: 5 بكسل؛ الحدود: 1 بكسل أبيض خالص}
#btnStart {واضح:كلاهما؛ العرض: 100 بكسل؛ الارتفاع: 30 بكسل؛ الهامش العلوي: 10 بكسل؛ الحشو: 0؛ الخلفية:#bbb; اللون: #222؛ الحدود: 1px الصلبة #fff؛ لون الحد السفلي:#000; لون الحدود الأيمن:#000; المؤشر:المؤشر}
</نمط>
<نوع البرنامج النصي = "نص/جافا سكريبت">
// الكود بواسطة CNwander.
// شائع
الدالة $(شارع) {
إرجاع document.getElementById(str);
}
الدالة $tag(str,target) {
الهدف = الهدف || وثيقة؛
إرجاع target.getElementsByTagName(str);
}
// عالمي
// ثابت
فار العرض = 20، // 网格宽度
الارتفاع = 20، // 网格高度
SAY = ["相当不错،虽然说和CNwander还不是一个级别的"،"可以啊،再加点油都可以 وCNwander媲美了!"،"一个字،牛،،"连CNwander都甘拜下风了"،"差不多行"了،别把游戏玩爆了"]؛
فار لين = 3, //蛇的长度
السرعة، // 爬行速度
GridElems = multiArray(WIDTH,HEIGHT), // تحديد الموقع
الناقل، //承载对象(食物،障碍،滑板،刹车)
ثعبان، //蛇每节的坐标点
معلومات، //交互对话
btnStart، //开始按钮
توب سكور = لين،
ثعبان الموقت، //行走计时器
BrakeTimers = []، // قم بإيقاف تشغيله
SkateTimers = [], // 机滑板
مفتاح مباشر; // 方向键值 37-40 左上右下
نافذة.onload = وظيفة () {
معلومات = $("قل");
btnStart = $("btnStart");
initGrid(); // 网格初始化
document.onkeydown = AttachEvents; // 绑定方向事件
btnStart.onclick = الوظيفة (هـ) {
btnStart.blur(); // قم بتنزيل متصفح فايرفوكس
يبدأ()؛ // 游戏 开始
btnStart.setAttribute("disabled",true);
btnStart.style.color = "#aaa";
}
}
//开始游戏
بداية الوظيفة () {
لين = 3؛
السرعة = 10؛
المفتاح المباشر = 39؛
الناقل = multiArray(WIDTH,HEIGHT);
ثعبان = مصفوفة جديدة ()؛
واضح()؛
initSnake(); //الأصل هو 始化
addObject("الغذاء");
يمشي()؛
addRandomBrake();
}
//建网格
الدالة initGrid() {
var body = $tag("body")[0];
فار الجدول = document.createElement("الجدول")،
tbody = document.createElement("tbody")
for(var j = 0; j < HEIGHT; j++) {
var col = document.createElement("tr");
for(var i = 0; i < WIDTH; i++) {
فار الصف = document.createElement("td");
GridElems[i][j] = col.appendChild(row);
}
tbody.appendChild(col);
}
table.appendChild(tbody);
$("snakeWrap").appendChild(table);
}
//المصدر
الدالة initSnake() {
مؤشر فار = RandomPointer(len-1, len-1, WIDTH/2);
for(var i = 0; i < len; i++) {
فار x = المؤشر[0] - أنا،
y = المؤشر[1];
ثعبان.push([x,y]);
الناقل[x][y] = "الغطاء";
}
}
// 添加键盘事件
دالة AttachEvents(e) {
ه = ه || حدث؛
directkey = Math.abs(e.keyCode - directkey) != 2 && e.keyCode > 36 && e.keyCode < 41 ? e.keyCode: المفتاح المباشر؛ // 非方向键、反向无效
عودة كاذبة.
}
وظيفة المشي () {
if(snakeTimer) window.clearInterval(snakeTimer);
SnakeTimer = window.setInterval(step, Math.floor(3000/speed));
}
خطوة الوظيفة () {
//获取目标点
فار هيدX = ثعبان[0][0]،
headY = ثعبان[0][1];
التبديل (المفتاح المباشر) {
الحالة 37: headX -= 1; استراحة؛
الحالة 38: رأس Y -= 1؛ استراحة؛
الحالة 39: headX += 1؛ استراحة
الحالة 40: headY += 1; استراحة؛
}
// 碰到边界، 挡 物، 结 束游戏
if(headX >= WIDTH || headX < 0 || headY >= HEIGHT || headY < 0 || الناقل[headX][headY] == "block" || الناقل[headX][headY] == "cover" ) {
تتبع("انتهت اللعبة");
if(getText($("النتيجة"))*1 < len) Trace(len,$("النتيجة"));
btnStart.removeAttribute("disabled");
btnStart.style.color = "#000";
window.clearInterval(snakeTimer);
for(var i = 0; i < BrakeTimers.length; i++) window.clearTimeout(brakeTimers[i]);
for(var i = 0; i <skateTimers.length; i++) window.clearTimeout(skateTimers[i]);
يعود؛
}
//加速
إذا (len % 4 == 0 && speed < 60 && الناقل [headX] [headY] == "food") {
السرعة += 5؛
يمشي()؛
تتبع("加速!");
}
//المصدر
إذا (الناقل [headX] [headY] == "الفرامل") {
السرعة = 5؛
يمشي()؛
تتبع("恭喜!捡到刹车一个.");
}
// 遭遇滑板
إذا (الناقل [headX] [headY] == "تزلج") {
السرعة += 20;
يمشي()؛
تتبع("遭遇滑板!");
}
// 添加阻挡物
إذا (len % 6 == 0 && len < 60 && الناقل[headX][headY] == "food") {
addObject("block");
}
//对话
إذا (لين <= 40 && لين % 10 == 0) {
فار يهتف = SAY[len/10-1];
تتبع(يهتف);
}
//吃东西
إذا (carrier[headX] [headY]!= "food") {
فار lastX = ثعبان[snake.length-1][0]،
lastY = ثعبان[snake. length-1][1];
الناقل[lastX][lastY] = false;
GridElems[lastX][lastY].className = "";
ثعبان. البوب ()؛
} آخر {
الناقل[headX][headY] = false;
تتبع("吃到食物");
addObject("الغذاء");
}
ثعبان.unshift([headX,headY]);
Carrier[headX][headY] = "cover";
GridElems[headX][headY].className = "cover";
لين = ثعبان. الطول؛
}
// 添加物品
وظيفة addObject(الاسم) {
var p = RandomPointer();
الناقل[p[0]][p[1]] = الاسم;
GridElems[p[0]][p[1]].className = name;
}
//الحصول على أفضل النتائج والفوائد
وظيفة addRandomBrake () {
فار نوم = RandowNum(1,5);
ل(var i = 0; i < num; i++) {
BrakeTimers.push( window.setTimeout(function(){addObject("brake")},randowNum(10000,100000)) );
SkateTimers.push( window.setTimeout(function(){addObject("skate")},randowNum(5000,100000)) );
}
}
//المصدر: 信息
تتبع الدالة (sth، who) {
من = من || معلومات؛
if(document.all) who.innerText = sth;
else who.textContent = sth;
}
//获取信息
وظيفة الحصول على النص (الهدف) {
if(document.all) return target.innerText;
وإلا قم بإرجاع target.textContent؛
}
//创建二维数组
وظيفة متعددة المصفوفات (م، ن) {
var arr = new Array(n);
ل(فار ط = 0؛ أنا<م؛ i++)
arr[i] = new Array(m);
العودة آر؛
}
// 清除画面
وظيفة واضحة () {
for(var y = 0; y <gridElems.length; y++) {
for(var x = 0; x <gridElems[y].length; x++) {
GridElems[x][y].className = "";
}
}
}
//الحصول على أفضل النتائج
دالة RandomPointer(startX,startY,endX,endY) {
startX = startX || 0;
startY = startY || 0;
endX = endX || عرض؛
endY = endY || ارتفاع؛
فار ص = []،
x = Math.floor(Math.random()*(endX - startX)) + startX،
y = Math.floor(Math.random()*(endY - startY)) + startY;
if(carrier[x][y]) return RandomPointer(startX,startY,endX,endY);
ع[0] = س؛
ص[1] = ص؛
العودة ص؛
}
// 生随机整数
الدالة RandowNum(البدء، النهاية) {
return Math.floor(Math.random()*(end - start)) + start;
}
</script>
</الرأس>
<body onselectstart="return false">
<div id="say">العنوان</div>
<div id="snakeWrap"></div>
<div معرف = "مساعدة">
<span class="box food"></span><span>الأطعمة الغذائية</span>
<span class="box block"></span><span>المنتجات</span>
<span class="box Skate"></span><span>التزلج على الجليد</span>
<span class="box Brake"></span><span>الفرامل</span>
<span style="float:right">القيمة:<strong id="score">0</strong></span>
<نوع الإدخال = "زر" معرف = "btnStart" القيمة = "开始游戏" />
</div>
</الجسم>
</html>
نصائح: (اطلبها، قم بتعديلها)
- IE: element.innerText = FF: element.textContent;
- setAttribute("cellpadding"،"0")، قم بتشغيل IE 中无效، 正确 写法cellPadding (الحصول على 一不小心)就
犯错
- 了))؛
- قم بإنشاء عنصر جدول في
- IE، قم بإنشاء tbody؛
):
// الكود بواسطة CNwander.
// شائع
الدالة $(شارع) {
إرجاع document.getElementById(str);
}
الدالة $tag(str,target) {
الهدف = الهدف || وثيقة؛
إرجاع target.getElementsByTagName(str);
}
// عالمي
// ثابت
فار العرض = 20، // 网格宽度
الارتفاع = 20، // 网格高度
SAY = ["相当不错،虽然说和CNwander还不是一个级别的"،"可以啊،再加点油都可以 وCNwander媲美了!"،"一个字،牛،،"连CNwander都甘拜下风了"،"差不多行"了،别把游戏玩爆了"]؛
فار لين = 3, //蛇的长度
السرعة، // 爬行速度
GridElems = multiArray(WIDTH,HEIGHT), // تحديد الموقع
الناقل، //承载对象(食物،障碍،滑板،刹车)
ثعبان، //蛇每节的坐标点
معلومات، //交互对话
btnStart، //开始按钮
توب سكور = لين،
ثعبان الموقت، //行走计时器
BrakeTimers = []، // قم بإيقاف تشغيله
SkateTimers = [], // 机滑板
مفتاح مباشر; // 方向键值 37-40 左上右下
نافذة.onload = وظيفة () {
معلومات = $("قل");
btnStart = $("btnStart");
initGrid(); // 网格初始化
document.onkeydown = AttachEvents; // 绑定方向事件
btnStart.onclick = الوظيفة (هـ) {
btnStart.blur(); // قم بتنزيل متصفح فايرفوكس
يبدأ()؛ // 游戏 开始
btnStart.setAttribute("disabled",true);
btnStart.style.color = "#aaa";
}
}
//开始游戏
بداية الوظيفة () {
لين = 3؛
السرعة = 10؛
المفتاح المباشر = 39؛
الناقل = multiArray(WIDTH,HEIGHT);
ثعبان = مصفوفة جديدة ()؛
واضح()؛
initSnake(); //الأصل هو 始化
addObject("الغذاء");
يمشي()؛
addRandomBrake();
}
//建网格
الدالة initGrid() {
var body = $tag("body")[0];
فار الجدول = document.createElement("الجدول")،
tbody = document.createElement("tbody")
for(var j = 0; j < HEIGHT; j++) {
var col = document.createElement("tr");
for(var i = 0; i < WIDTH; i++) {
فار الصف = document.createElement("td");
GridElems[i][j] = col.appendChild(row);
}
tbody.appendChild(col);
}
table.appendChild(tbody);
$("snakeWrap").appendChild(table);
}
//المصدر
الدالة initSnake() {
مؤشر فار = RandomPointer(len-1, len-1, WIDTH/2);
for(var i = 0; i < len; i++) {
فار x = المؤشر[0] - أنا،
y = المؤشر[1];
ثعبان.push([x,y]);
الناقل[x][y] = "الغطاء";
}
}
// 添加键盘事件
دالة AttachEvents(e) {
ه = ه || حدث؛
directkey = Math.abs(e.keyCode - directkey) != 2 && e.keyCode > 36 && e.keyCode < 41 ? e.keyCode: المفتاح المباشر؛ // 非方向键、反向无效
عودة كاذبة.
}
وظيفة المشي () {
if(snakeTimer) window.clearInterval(snakeTimer);
SnakeTimer = window.setInterval(step, Math.floor(3000/speed));
}
خطوة الوظيفة () {
//获取目标点
فار هيدX = ثعبان[0][0]،
headY = ثعبان[0][1];
التبديل (المفتاح المباشر) {
الحالة 37: headX -= 1; استراحة؛
الحالة 38: رأس Y -= 1؛ استراحة؛
الحالة 39: headX += 1؛ استراحة
الحالة 40: headY += 1; استراحة؛
}
// 碰到边界، 挡 物، 结 束游戏
if(headX >= WIDTH || headX < 0 || headY >= HEIGHT || headY < 0 || الناقل[headX][headY] == "block" || الناقل[headX][headY] == "cover" ) {
تتبع("انتهت اللعبة");
if(getText($("النتيجة"))*1 < len) Trace(len,$("النتيجة"));
btnStart.removeAttribute("disabled");
btnStart.style.color = "#000";
window.clearInterval(snakeTimer);
for(var i = 0; i < BrakeTimers.length; i++) window.clearTimeout(brakeTimers[i]);
for(var i = 0; i <skateTimers.length; i++) window.clearTimeout(skateTimers[i]);
يعود؛
}
//加速
إذا (len % 4 == 0 && speed < 60 && الناقل [headX] [headY] == "food") {
السرعة += 5؛
يمشي()؛
تتبع("加速!");
}
//المصدر
إذا (الناقل [headX] [headY] == "الفرامل") {
السرعة = 5؛
يمشي()؛
تتبع("恭喜!捡到刹车一个.");
}
// 遭遇滑板
إذا (الناقل [headX] [headY] == "تزلج") {
السرعة += 20;
يمشي()؛
تتبع("遭遇滑板!");
}
// 添加阻挡物
إذا (len % 6 == 0 && len < 60 && الناقل[headX][headY] == "food") {
addObject("block");
}
//对话
إذا (لين <= 40 && لين % 10 == 0) {
فار يهتف = SAY[len/10-1];
تتبع(يهتف);
}
//吃东西
إذا (carrier[headX][headY] != "food") {
فار lastX = ثعبان[snake.length-1][0]،
lastY = ثعبان[snake. length-1][1];
الناقل[lastX][lastY] = false;
GridElems[lastX][lastY].className = "";
ثعبان. البوب ()؛
} آخر {
الناقل[headX][headY] = false;
تتبع("吃到食物");
addObject("الغذاء");
}
ثعبان.unshift([headX,headY]);
Carrier[headX][headY] = "cover";
GridElems[headX][headY].className = "cover";
لين = ثعبان. الطول؛
}
// 添加物品
وظيفة addObject(الاسم) {
var p = RandomPointer();
الناقل[p[0]][p[1]] = الاسم;
GridElems[p[0]][p[1]].className = name;
}
//الحصول على أفضل النتائج والفوائد
وظيفة addRandomBrake () {
فار نوم = RandowNum(1,5);
ل(var i = 0; i < num; i++) {
BrakeTimers.push( window.setTimeout(function(){addObject("brake")},randowNum(10000,100000)) );
SkateTimers.push( window.setTimeout(function(){addObject("skate")},randowNum(5000,100000)) );
}
}
//المصدر: 信息
تتبع الدالة (sth، who) {
من = من || معلومات؛
if(document.all) who.innerText = sth;
else who.textContent = sth;
}
//获取信息
وظيفة الحصول على النص (الهدف) {
if(document.all) return target.innerText;
وإلا قم بإرجاع target.textContent؛
}
//建二维数组
وظيفة متعددة المصفوفات (م، ن) {
var arr = new Array(n);
ل(فار ط = 0؛ أنا<م؛ i++)
arr[i] = new Array(m);
العودة آر؛
}
// 清除画面
وظيفة واضحة () {
for(var y = 0; y <gridElems.length; y++) {
for(var x = 0; x <gridElems[y].length; x++) {
GridElems[x][y].className = "";
}
}
}
//الحصول على أفضل النتائج
دالة RandomPointer(startX,startY,endX,endY) {
startX = startX || 0;
startY = startY || 0;
endX = endX || عرض؛
endY = endY || ارتفاع؛
فار ص = []،
x = Math.floor(Math.random()*(endX - startX)) + startX،
y = Math.floor(Math.random()*(endY - startY)) + startY;
if(carrier[x][y]) return RandomPointer(startX,startY,endX,endY);
ع[0] = س؛
ص[1] = ص؛
العودة ص؛
}
// 生随机整数
الدالة RandowNum(البدء، النهاية) {
return Math.floor(Math.random()*(end - start)) + start;
}