阿里巴巴2013实习生前端笔试题5月19号版

最新推荐文章于 2021-03-10 18:47:02 发布

原创最新推荐文章于 2021-03-10 18:47:02 发布 · 1.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#阿里巴巴 #前端笔试 #2013实习

web前端专栏收录该内容

3 篇文章

订阅专栏

本文分享了一次前端笔试的经历，包括HTML、CSS布局实践题及JavaScript DOM操作等，并反思了答题过程中的不足。

本来应该5号去笔试的，因为某课给冲掉了，不得已打电话到北京要求调整到19号，结果室友早早收到19号笔试通知，我到了19号上午11点左右才接到北京打来的电话。坑爹的前奏啊~前端是和测试开发在一个教室的，一眼望去，妹子还是相当多的，无论是前端还是测试，当然还是测试略多些，不过据闻测试开发的笔试题和研发的题一样，测试考90分钟，前端只有60分钟。

第一题：

我纠结的是语义HTML，需要写css么？之前看网上一些5号版的，好像都有写css，但我之前有查过什么是语义化的html，是并不包含的css的，而且觉得这个要写css其实也挺简单，不过最近没怎么好好看，所以最终也没有写上css。我只用最简单的html，不过现在想想也出了写小问题。不知道是不是该用table，平时基本不用table，某老师说，这货违反了html和css分离的目的，反叛分子来着

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h3>您的基本信息</h3>
<label for='username'>姓名：</label>
<input type="text"/><br/>
<label for="gender">性别：</label>
<select>
    <option selected="selected">男性</option>
    <option>女性</option>
</select>
<h3>设置密码</h3>
<label for="password">密码：</label>
<input type="password"/><br/>
<label for="passwordAgain">再输一遍：</label>
<input type="password"/><br/>
<button type="sumit" value="确定">确定</button> <!--type="button"-->
<button  value="取消">取消</button> <!--type="button"-->
</body>
</html>

第二题：

刚刚测试了，确实是呈现#container a的颜色，这个主要是之前听大神提到一个css选择器ABCD，可参考http://www.cnblogs.com/rubylouvre/archive/2010/03/17/1687786.html 简而言之就是，样式优先级：行内样式 > id > 类和伪类 > 标签。之前笔试遇到一个将class = “a b”，a、b中对color有不同的赋值，结果显示的是a的颜色。

第三题：

这个题是最后做的，默默觉得坑爹的节奏。反正做得不是很好，这题我又纠结地把css写上去了 = = ，我只贴下html部分吧，style还是免去吧，没有考虑完全，漏洞百出

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h3>你可能认识</h3>
<div class="container">
    <div class="person">
        <img src="...." alt="yyh"/>
        <p>yyh</p>
        <p>(yh)</p><!--这里应该错了，想不起该用什么-->
        <img src="add..." alt="add"/>
        <img src="cancle..." alt="cancle"/>
    </div>
    <div class="person"></div>
    <div class="person"></div>
    <div class="person"></div>
    <div class="person"></div>
    <div class="person"></div>
    <div class="more">更多<span> > </span></div>
</div>

</body>
</html>

b小问不知道我理解的对不对，感觉和“给定一个宽度的div，让其在页面居中，用css实现”是一样的意思，反正我用同种方法解答的。1) 设置图片的宽度(容器的宽度应该已经设好，虽然我当时写的样式忘记设置了 T^T); 2) 用left和margin-left

.person img{
            width: 100px;
            left: 50%;
            margin-left: -50px;/*width的一半*/
        }

第四题：

我的答案已经在图片中了，也不知道对不对，对JSON不是很了解，没怎么用过 = =。

第五题：

题目就是创建这样的DOM并添加到body内去。尼玛，发现现在写一遍才发现大错特错啊！果然练习得少，连这个都忘记了。默默到墙角画圈圈去了

<script type="text/javascript">
    var body = document.body;
    var div = document.createElement("div");
    div.id = "example";
    var p = document.createElement('p');
    p.className = "slogan";
    p.innerHTML = "you like";
    div.appendChild(p);
    body.appendChild(div);
</script>

记得放在body标签之后，或者将其封装到一个匿名函数，赋给window.onload。因为要等待DOM文档结构加载完成才可以。

第六题：

迄今为止你做过的项目中使用最牛逼的前端技术，大概就是这个意思。时间不够，也没啥经验，所以就写了几句话。

总结：

其实考得也不难，但是没有大量编码和扎实的基础知识，也不可能回答得很完美。我就是去体验生活的，准确的说是体验“生存”，也不期望能过笔试了T^T