《智勇大闖關第三季》闖關地址：http://ued.campus.alibaba.com/quiz3/index.php(需要chrome)

以我目前的水平，我認為兩個小時之內闖到第六關的，都可以算是高手了，咳，這還只是一個校招游戲。

攻略開始之前，先做個聲明：

本人菜鳥一個，從第四關開始就歇菜了，此攻略來自于JS/Javascript交流群(31609956)，本人撰稿，并由以下幾位同學協助完成：嚼頭(592737223)、js-dino(904591031)、難得清醒(582416882)，尤其是dino同學，提供了很多幫助，膜拜了要。

第一關

1. 鼠標點擊號碼器上的回車鍵，彈出“Opps，不是這個密碼！”
2. f12，resources中查找彈出的這段文字，在step0.js的第155行：window.location = Base64.decode(S.one("#page").attr('data-t')); 可以看出密碼輸入成功之后會跳轉到Base64.decode(S.one("#page").attr('data-t'))；
3. f12,elements中找到id="page"的div，復制data-t的屬性值L3F1aXozL2luZGV4LnBocD90PU9HUTNORFpsTXpreVoxcHFXa3BCYkVWRlFsWlpUMVZuTUVaV2FEbFc=
4. f12,console中輸入window.location = Base64.decode("L3F1aXozL2luZGV4LnBocD90PU9HUTNORFpsTXpreVoxcHFXa3BCYkVWRlFsWlpUMVZuTUVaV2FEbFc=")，按回車運行，此時頁面跳轉到第二關。
總結：考察的應該是瀏覽器調試DOM屬性操作之類的東西。

第二關

原理：紅色激光束上下各有一個灰色的小鏡子，需要改變兩面鏡子的位置和角度讓激光束穿過小黑點。考察的是css2的定位以及css3的旋轉。
操作：下方的鏡子調整后的位置大概是top: 550px;添加一個css3的旋轉屬性：-webkit-transform: rotate(-82deg);，后續原理同上。最后結果如下圖

點擊確定進入第三關。

第三關

1. 標題是坐標，隱藏的線索，右下角一個二維碼框，并且控制臺中隔一段時間輸出了這么一段文字X：咦，這里有個canvas，是不是在上面畫些什么——看樣子是需要寫一些代碼畫點二維碼，考察canvas。
2. F12,elements中id=main的div下面兩行，有一大片注釋掉的數字，觀察數字，是每四個數字一組，并且用空格隔開了。再看二維碼部分是一個canvas，由此猜想這是需要根據fillRect(x,y,width,height)畫矩形。
3. 復制下注釋部分的數字串，F12, console中運行以下代碼
var c = document.getElementById('qr-canvas').getContext('2d');
var s="0,0,12,12 12,0,………..……太多了省略……….....,12,12 228,240,12,12";
var a=s.split(' ');
for(i=0;i<a.length;i++){
var b=a[i].split(',');
c.fillRect(b[0],b[1],b[2],b[3]);
}
此時，二維碼已經畫滿了，效果圖如下：

確定之后跳轉到第四關。

第四關

闖關思路：這一關主要考察技術大牛常去的網站、常用的工具、常用的技術等常識性問題。注意要根據圖片和圖片下的提示來猜答案（圖片相同但提示不同會導致答案也不同）。下面貼出圖片和對應答案：（圖在上答案在下）

w3

stackoverflow

Jade

zepto

Github

CSS Sprites

Grunt （樓下補充by fanfanqq250）

這里的問題比較多，不過也就是隨機出現三到四個的樣子，上面列的不全。吶，接下來會跳轉到第五關了。

第五關

1. 注意觀察room后面的數字和瀏覽器地址欄后面的room參數，兩者是不一樣的，比如我的t=OTkzN2JmYzNEOU13YkxCd1VDQWxBQ0RsY0JCeHNH&room=35。思路應該是把氣泡里的房間號改到地址欄然后回車，不斷改不斷回車，注意觀察下面氣泡文字的變化。可以使用下面的代碼不斷運行。
2. F12,console中運行以下代碼
var search = location.search;
location.search = search.replace(/room=d*/, function( ) {
return "room=" + jQuery("#next-room").text();
});
3. 重復運行第二步的代碼，會看到聊天氣泡中的文字在不斷變化，如下圖

繼續重復運行代碼，會看到他一個字一個字的告訴你下一關的鏈接了，注意要記下來，比如我的：/quiz3/index.php?t=ZTlkZDVhOWV1dmhvY0tBVkFHQkFaVFdnVlJVeFVD，然后把個t參數復制到地址欄，回車，第六關就開始了。

注：是不是有更好的辦法？

第六關

這一關需要清除掉X的指紋信息，無視此處的輸入框，方法同第一關 （搞不明白通關方法一樣的話，那設置此關有何意義？）。

——————————————————

以上為第三季，下面貼一個第二季的，有興趣的可以玩玩。http://ued.taobao.com/quiz2/

轉載請注明出處：http://www.cnblogs.com/youryida 歡迎留言或qq交流(1140215489)

總結

以上是生活随笔為你收集整理的阿里前端闯关游戏 “智勇大闯关第三季” 闯关攻略的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。