【JS每日練習】阿里巴巴web前端開發面試題
阿新 • • 發佈：2019-01-03
今天在瀏覽一個網站的時候，找到了阿里巴巴的Web前端面試題，然後自己做了下，跟大家分享一下
第一部分：用CSS實現佈局
讓我們一起來做一個頁面
首先，我們需要一個佈局。
請使用CSS控制3個div，實現如下圖的佈局。
第二部分：用javascript優化佈局
由於我們的使用者群喜歡放大看頁面
於是我們給上一題的佈局做一次優化。
當滑鼠略過某個區塊的時候，該區塊會放大25%，
並且其他的區塊仍然固定不動。
提示：
也許，我們其他的佈局也會用到這個放大的效果哦。
可以使用任何開原始碼，包括曾經你自己寫的。
關鍵字：
javascript、封裝、複用
第三部分：處理緊急情況
好了，我們的頁面完成了。
於是我們將頁面釋出上網。
突然，晴天霹靂，頁面無法訪問了，這時候，你會怎麼做？
這三道題我個人覺得挺基礎的，但也會碰到一些問題，這裡我只是處理了下第一個div的行為，其他的類似處理，程式碼如下
<!Doctype html> <html> <head> <meta charset=gb2312> <title>阿里巴巴面試題</title> <style> *{margin:0;padding:0;} div{background-color:#92c9c9;border:1px solid #00a7f7} .div1{width:30%;height:200px;float:left;} .div2{width:68%;height:620px;float:right;} .div3{float:left;width:30%;height:400px;margin-top:20px;position:absolute;top:200px;left:0;} </style> <script> function scaleObj(obj) { obj.style.border = "1px solid #000"; obj.style.backgroundColor = '#9bffff'; obj.style.position = "absolute"; obj.style.zIndex = 1; obj.style.width = "460px"; obj.style.height = "260px"; } function restoreSty(obj) { obj.style.border = '1px solid #00a7f7'; //為了相容IE，這裡最好不要填空 obj.style.backgroundColor = ''; obj.style.width = ''; obj.style.height = ''; } </script> </head> <body> <div class="div1" id="div1" onmouseover="scaleObj(this)" onmouseout="restoreSty(this)"></div> <div class="div2"></div> <div class="div3"></div> </body> </html>
程式碼只是說明了前兩個問題，那麼第三個問題怎麼回答呢？
對大多數人來說，尤其是程式碼控，難的不是程式碼，而是理論問題或者口頭的表達，作為一個非計算機專業的人士，我的回答僅供參考
第一條毫無疑問是伺服器的原因：繁忙的伺服器日積月累，終於有一天垮了，伺服器崩潰也是一個常常能夠遇到的問題，壓力大啊...
第二點：莫非是上傳過程導致的問題，上傳網頁也是一個技術活，你確定你做對了嗎？
第三點：最弱智的，最愚蠢的,請問你聯網了？
第四點：瀏覽器相容性造成頁面無法顯示的可能性幾乎沒有，但你也可以嘗試著換一個瀏覽器
第五點：我該換換腦子了，或許百度一下你可以找到原因的