8月20号阿里巴巴前端岗位校园招聘的线上笔试题，因为是面向2014界的应届生，哥不符合要求了，但也看了看题，哥也不是什么前端大拿，必然无法评价题的质量了，不过玉伯，寒冬等大拿都评价题还是不错的，区分度很好，由于题目是随机的，囧。自码答案，有误欢迎指正，部分问题还没添加答案~
No.1
下图绿色区域的宽度为100%，其中有三个矩形，第一个矩形的宽度是200px，第二个和第三个矩形的宽度相等。请使用css3中的功能实现它们的布局。
已知html结构是：
<div> <div>column 1</div> <div>column 2</div> <div>column 3</div> </div>
No.2
有两个盒子 A、B，B 在 A 盒子中，它们的 css 是这么定义的：
A {
position:relative;
width:500px;
height: 500px;
background-color:green;
}
B {
position:absolute;
max-width:300px;
max-height:300px;
background-color:blue;
}
如何实现 B 在 A 中水平方向和垂直方向居中
No.3
经常在SNS中看到如下图所示的功能：
请通过代码完成它，它至少应该：
1. 良好结构、语义化的HTML
2. 兼容主流的浏览器；
3. JS应该包括： 1) 实时计数功能 2)校验字数限制 3) 防止重复提交；
4. 如果时间所限，无法100%，但请说明实现方案及思路；
No.4
//现有代码如下:
function test() {
var a = 1;
setTimeout(function() {
alert(a);
a = 3;
}, 1000);
a = 2;
setTimeout(function() {
alert(a);
a = 4;
}, 3000);
}
test();
alert(0);
//请注意,代码中有三处alert.他们分别会alert出什么值,时间上的顺序是怎样的?
//请详述得到这个答案的原因,特别是test函数的局部变量a是对运行结果的影响.
No.5
当我们使用CSS3新属性，比如：box-shadow或者transition时，我们怎么检测浏览器是否支持这些属性？
请设计一个javascript函数，该函数接受一个CSS属性名作为参数，并返回一个boolean值，表明浏览器是否支持这个属性。
No.6
如果你现在使用的是 Google Chrome 或 Apple Safari，如何让 input 元素在默认情况下显示 “alipay WD Team”，而在光标移入后则显示空白？
No.7
解释一下
alert(Function instanceof Object); alert(Object instanceof Function);
这个结果。
No.8
//现有代码如下：
var foo = 1;
function main(){
alert(foo);
var foo = 2;
alert(this.foo)
this.foo = 3;
}
//1.请给出以下两种方式调用函数时，alert的结果，并说明原因。
var m1 = main();
var m2 = new main();
//2.如果想要var m1 = main()产生的m1和前面的m2完全一致,又该如何改造main函数?
No.9
实现如下图所示的布局
要求：
sidebar 固定宽度200px，content和header宽度自适应
当window宽度小于600px时，变成三行布局
默认如下
宽度小于600px时如下
下面是html结构：
<div class='header'> <h1>header</h1> </div> <div>sidebar"</h1> </div> <div> <h1>content</h1> </div>
请写出其css代码.
No.10
写一段脚本，实现：当页面上任意一个链接被点击的时候，alert出这个链接在页面上的顺序号，如第一个链接则alert(1), 依次类推；
No.11
请用html5标准完成以下页面布局（要求完整书写整个页面的html代码，不需要写CSS）
No.12
有一个页面区块如图所示，请用符合语义化的标签书写HTML代码。
No.13
在CSS样式中常使用px、em两种长度单位，各有什么优劣，在表现上有什么区别？
No.14
(new Date).getTime() 和 +new Date() 都可以取到当前时间戳，它们的实现原理是什么，哪个效率更高？
No.15
在tmall.com的某个页面中存在一个id等于J_iframe_taobao的iframe，该iframe的域名是taobao.com。在不考虑IE浏览器的情况下，用最简洁的代码实现页面与该iframe进行双向通信？
... <iframe id="J_iframe_taobao" src="http://taobao.com/xxx"></iframe> ...
No.16
请写一个 getParents 方法让它可以获取某一个 DOM 元素的所有父亲节点。
No.17
请写出至少5个html5新增的标签，并说明其语义和应用场景
No.18
有哪些前端代码优化/性能优化的方法？
No.19
请列举所知道的css选择器，并说明怎么判断优先级？
No.20
有一个数组，其中保存的都是小写英文字符串，现在要把它按照除了第一个字母外的字符的字典顺序(字典顺序就是按首字母从a-z顺序排列，如果首字母相同则按第二个字母……)排序，请编写代码：
例：
["abd","cba","ba",]
排序后
["ba","cba","abd"]
No.21
1.你了解arguments对象么,它有哪些属性?
2.arguments是数组么?如果不是请写一段代码将其转化为真正的数组,什么情况下需要这么做?
3.arguments有什么特性,可以用这些特性做什么?
No.22
请为JavaScript每个Array对象添加一个类似于PHP的shuffle()的方法。
No.23
CSS的“伪类”和“伪元素”有什么区别？请举例伪元素的几种应用场景。
No.24
页面中有个id为J_banner的区块，请使用CSS实现在普通屏幕上使用图片banner.png为背景，在retina屏幕上显示更高分辨率的图片banner_retina.png作为背景
<div id="J_banner"> ... </div>
No.25
下面是一段html代码，展示效果如图A所示。请给出一段css，使这段代码达到图B的展示效果。
<ul> <li> <a href="#"><img width="100" height="100" src="a.jpg /></a> <p>文字一</p> </li> <li> <a href="#"><img width="100" height="100" src="a.jpg" /></a> <p>文字二</p> </li> </ul> <ul> <li>文字三</li> <li>文字四</li> <li>文字五</li> <li>文字六</li> </ul>
要求：
1.不允许修改html结构；
2.css不必考虑浏览器默认样式的因素，布局正确即可；
3.不要求严格对齐，如有需要，元素尺寸可自定义。
No.26
var a = [-3,-1,0,1,3,5,7,9], b = [-4,-2,0,2,3,4,5,6,7,8];
//返回一个合并过的数组[-4,-3,-2,-1,0,0,1,2,3,3,4,5,5,6,7,7,8,9]
No.27
//请补全下面的函数，仅当p为数组时返回true.
//可给出多种实现方式,每种实现方式不一定完美,如果不完美,需要说明每种实现的限制
function isArray(p) {
//你的代码在这里
}
No.28
<p>1</p> <p>2</p> <p>3</p>
请编写一段css，让数字1颜色变蓝
No.29
请让页面中的一个元素（10px*10px）围绕坐标(200, 300) 做圆周运动
No.30
用HTML实现下面表格的结构：
No.31
‘data-’属性的作用是什么？
No.32
请列举CSS中用于隐藏元素的两个属性？两者的差异？
display:none和visibility: hidden;前者不占位，后者占位。
No.33
在jquery中，选择器使用的是sizzle，sizzle的基本原理是”从后往前查找”，比如选择器“ .a > .b > .c”，是先查找”.c”而不是”.a”。请解释为什么大部分情况下“从后往前”比“从前往后”查找速度更快
No.34
//现有代码如下:
var a = 1;
var obj = { b : 2 };
var fn = function() {};
fn.c = 3;
function test(x, y, z) {
x = 4;
y.b = 5;
z.c = 6;
return z;
}
test(a, obj, fn);
alert(a + obj.b + fn.c);
//这段代码能够正常运行么?如果不能正常运行,请说明原因.
//如果可以运行,最后一行alert的值是多少,并请说明原因.
No.35
请编写一段程序，将一个对象和它直接、间接引用的所有对象的属性字符串放入一个数组。
如
var o = {a:1,{b:2,c:{d:1}}}
这里o经过处理后，应该得到
["a","b","c","d"]
No.36
请举两个例子，解释一下strong和em标签用法有何不同？
No.37
请用实现一个最简单的输入框提示功能
要求：
1.输入框内默认显示提示文案，当用户点击输入框后，光标定位到输入框最前，并继续显示提示文案，当用户输入后替换默认提示文案，当用户清空输入框后从新显示默认提示文案
2.要求支持ie（6，7，8，9），firefox，chrome等浏览器
3.请写出html结构，javascript代码逻辑部分写出实现思路即可（有时间能写出代码者最佳，可以使用js库）
5707
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
