今天阿里前端实习生的2个题目?

Question

第一个是:

 三个div排列要求宽度均等，我说按照百分比33.33% 分配，他说除不尽，求解？
 
 

第二个是：

 一个网页中假设有十个分页 每个分页有一张图片，利用ajax处理请求图片。比方说当你点击第五页时觉得图片很好想要复制url给朋友，但是朋友打开肯定是第一张的图片，因为url始终是第一页的url，求如何使对方直接跳转到第五页？
 
 (注：主考官一直坚持说url是不能变的，也就是说不能听过锚点变化)     

Answer 1

第一个就是flex布局的问题，第二个就是pjax，也就是路由问题，网上都有很清晰的解答

Answer 2

第一题用css3可以

//html
<div id="wrap">
    <div id="left">left</div>
    <div id="center">center</div>
    <div id="right">right</div>
</div>

//css
#wrap {
    width: 1000px;
    display: -moz-box;
    display: -webkit-box;
    display: box;
}
#wrap div {
    height: 500px;
    border:1px solid #000;
    -moz-box-flex: 1;
    -webkit-box-flex: 1;
    box-flex: 1;
}

Answer 3

第一题：
可以使用 flex 布局, 父元素设置 display：flex; 因为是三等分，每个 div 设置 flex:1; 这样不管父级元素的宽是多少，浏览器都会自动将每个 div 平均分成三份。

第二题：因为是通过 url 地址分享给朋友的，所以就可以在 url 上面做文章了，如果是在第一页的时候可以在 url 后面加一个参数，如：url?page=1，以此类推，到第五页就是 page=5，然后js去获取地址中的 page 参数，如果参数是5，那就 异步请求把第五页的数据获取下来

Answer 4

第一题：

<div class="container">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>

传统方法:

<style>
    .container{display: table; width:100%;}
    .item{display: table-cell;}
</style>

flex布局:

<style>
    .container{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around;width:100%;}
    .item{flex: 1;}
</style>

第二题:
猜想应该是考察history对象的操作，pushSate方法

Answer 5

这是考察服从性。。。。

Answer 6

第二题可以为图片设置一个锚点，然后通过在url后将对应的锚点让页面跳转到指定的位置

Answer 7

第二题不知道可不可以把第五页的pageIndex传过去，然后根据这个去请求到第五页或者前五页的内容

Answer 8

第一题就不说什么了。我觉得第二题可以用URL传参是一个办法。URL后面加?page＝5 载入页面用js解析location
如果不能用锚点也不能用参数，我也不知道怎么办

Answer 9

第二个感觉没法做 get的最大特性就是参数都放在url里 这样可以加收藏夹 你分享给朋友分享的就一个url
除非在服务端放一个状态 这不是荒唐么。。

除非是每个人看到的url不一样 你的url里带有唯一的状态可以和别人分享

第一个题 33%为啥除不尽 bootstrap玩了那么多年的12等分了也没说有除不尽的问题

Answer 10

第二个题用session搞定吧

Answer 11

第一个我想的是三个div没个占32%还有1%正好作为她们间隔，可以么？

Answer 12

第二题是利用类似淘口令的东西吧？

Answer 13

我来马克下，明天再来看，有事先走了

Answer 14

这题都答上了,阿里开多少钱?