2013年阿里巴巴實習生筆試題


    前幾天參加了阿里的筆試題,題目雖然很簡單,但是現在回想下發現出了不少問題,還是基礎不牢固啊。把這些題目寫出來也算是對自己的一種提升吧。

    1.html題

     

   代碼: 

<!DOCTYPE html>
<html>
    <head> 
    </head>
	<style>
	table,td,th{
		border: 1px solid #000;
		border-collapse: collapse;
		text-align: center;
	}
	</style>
    <body>
    <table class="table" cellspacing="0">
        <thead>
         <tr>
            <th>國家</th>
            <th>名稱</th>
            <th>域名</th>
            <th>排名</th>
        </tr>
        </thead> 
        <tbody>
        <tr>
            <td>中國</td>
            <td>淘寶</td>
            <td>www.taobao.com</td>
            <td>1</td>
        </tr>
        <tr>
            <td rowspan="2">美國</td>
            <td>epay</td>
            <td>www.epay.com</td>
            <td>2</td>
        </tr>
        <tr>
            <td>amazon</td>
            <td>www.epay.com</td>
            <td>3</td>
        </tr>
        </tbody>
        <tfoot>
            <tr>
            <td colspan="4" style="text-align:right">www.a.com</td>
        </tr>
        </tfoot>
    </table>
    </body>
</html>

  2.css選擇器的縮寫,具體代碼記不清楚了,就是涉及background、font、#000000之類、后代選擇器的縮寫

     3.先是語義化一個登錄界面,然后是實現css部分(圓角半透明)。當時是想不起來如何實現半透明,找了找資料,發現是通過rgba(r,g,b,a)中的a來實現開透明的,還是基礎知識掌握的不牢固啊。下面是自己寫的代碼,顏色背景什么的沒有細致調整,樣子大致是這樣。

   

<!DOCTYPE html>
<html>
    <head>
    <style type="text/css">
	*{
	    margin: 0;
	    padding: 0;
	}
        #login{
	    position: relative;
	    margin: 0 auto;
	    width: 300px;
	    border: 10px solid rgba(0,0,0,0.4);
	    border-radius: 3px;
	}
		#delete{
			overflow: hidden;
			background: #555; 
		}
		#delete input{ 
			float: right;
			width: 28px;
			background: url(img/delete.png) no-repeat right top #555;
		}
		#login h3{  
			background: rgb(240, 173, 173);
			padding: 5px 10px;
		}
		#loginForm{
			padding: 10px;
		}
		#loginForm div{
			margin: 5px;
		}
		#submit{
			text-align: center;
		} 
		#submit input{
			margin: 0 10px;
		}
    </style>
    </head>
    <body>
		<div id="login">
			<div id="delete">
				<input type="button"  /> 
			</div>
			<h3>淘寶登錄頁面</h3>
			<form id="loginForm" action="" method="post">
				<div id="user">
					<label for="userName"> 用戶名: </label>
					<input type="text" id="userName"/>
				</div>
				<div id="password">
					<label for="password"> 密  碼: </label>
					<input type="password" id="password" />
				</div>
				<div id="submit"> 
					<input type="submit" value="登 錄" /><a>請注冊</a>
				</div>
			</form>
		</div>
    </body> 
</html>

  

     4.查找頁面中所有類為test的節點,當時是對document.body.childNodes進行遍歷,沒有想到子節點還有可能擁有子節點,此題就此倒下,貼出一個可行的吧:     

function getByClass(test){ 
	var lists = document.getElementsByTagName('*');
	var result = [];
	var reg = new RegExp('\\b'+test+'\\b');
	for(var i=0,len=lists.length;i<len;i++){
		if(reg.test(lists[i].className)){
			result.push(lists[i]);
		}
	}
	return result;
}

  5.刪除數組中的重復節點

if(! Array.prototype.unique){

       Array.prototype.unique = function(){
        
             var arr = this, temp = [], result = [];

             for(var i=0,len=arr.length;i<len;i++){
                  if(!temp[arr[i]]) {
                           result.push(arr[i]);
                           temp[arr[i]] = true;
                  }
             }
              return result;

       }


}

  6.談談對前端工程師的認識?這種題目就看自己發揮了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM