海豚浏览器前端面试总结

今天去参加了海豚的面试。从学校到海豚浏览器武汉公司花了将近3个小时的时间，真心有点崩溃了，还没有吃午饭。公司地址在光谷金融港里面，看上去有点高端大气上档次。个人觉得海豚还是蛮不错的，很喜欢。在武汉这个内地城市，互联网行业也不发达，但是我相信将来的发展前景还是蛮不错的。

说回面试吧。第一位是纯技术面，面试官人很好，总是笑嘻嘻的，很nice，天下的程序员都是可爱单纯的，哈哈。对于XHTML+CSS自认为应该没有什么难题了，以前做过将近三个月的实习，所以没有做好准备。对于正规的面试题有点搓手不急。

第一题：在一个div里面有三个div，三个div在一行，最左边的有固定宽度，中间的宽度自适应，最右边的宽度为10%；要实现三个div的水平平铺，用什么样的实现方法。

------左边的左浮动，右边的右浮动，中间的div overflow:auto;当时自己有点晕，怎么会有这么奇怪的布局。

我的结果-----把overflow设置为auto或hidden都可以。

 1 <style>
 2     *{margin:0;padding:0;}
 3     .content{width:100%;}
 4     .first{width:200px;height:200px;background:#999;float:left;}
 5     .second{overflow:hidden;height:200px;background:#000;}
 6     .third{width:10%;height:200px;background:#F00;float:right;}
 7 </style>
 8 </head>
 9 <body>
10 <div class="content">
11     <div class="first"></div>
12     <div class="third"></div>
13     <div class="second"></div>
14 </div>

第二题：关于清除浮动，之前有过研究，时间久了没用忘记了，贴上链接http://www.cnblogs.com/mizzle/archive/2011/07/14/2105961.html

第三题：position的属性值，以及区别。说句实话，我都理解了，可能当时面试的时候错误理解了面试官的问题。W3school教程，这个也不多说了，http://www.w3school.com.cn/css/pr_class_position.asp，别忘了static默认值。

第四题：标签的语义化要注意的位置以及意义。当时，面试官直接拿了一段代码给我看，要指出其中的问题，大致是这样的。<P>&nasp;$nasp;这里是HTML我的<br><br>语句&nasp;</p>

因为代码是手写的，我只觉得br标签没有闭合，其他没有什么问题；如果提示一下语义化我就知道代码的漏洞了。标签都需要小写，并且所有的标签需要闭合，每个标签都要各司其职，p就应该用来装段落，h就应该来放标题等等，例如空格，缩进就应该用CSS来控制。其实这些我都知道，只是不知道切入点在哪。。

还有一些个关于如何控制图片放大缩小的题目，使用CSS3实现，没有深入的接触CSS3，有点心虚。。

XHTML+CSS就这么多吧，之前心里完全没有担心这个，而是看了一些HTML5的内容，没有问相关的。。总结一点，自己对这一块还没有足够的深入，需要找一些奇葩的面试题做做，接触得多一点。

 

关于Js。第一个：事件绑定的使用方法，当时有点愣住了或者大脑短路了，不就是bind()函数么，在原生里面addEvent(),参看这篇博客http://blog.csdn.net/haijiaoxiaowu/article/details/5150389

第二个：事件冒泡（从子元素到父元素）和事件捕获；这两者之间的顺序把我弄晕了，没有怎么用过，一般也就是return flase去解决。

http://www.cnblogs.com/zhenn/archive/2011/02/20/1959059.html

http://www.cnblogs.com/webflash/archive/2009/08/23/1552462.html

第三个：(′div′).eq(i)和('div').[i]以及$('div').get(i)三者之间的区别。

第四个：下面的三行代码分别弹出什么，有点瞎纠结了

1 window.onload=function(){
2         var obj={};
3         //obj.a=1;
4         //obj['a']=1;    
5         alert(obj);    
6     };

第五个：cookie,localStorage,sessionStorage三者之间的区别。

http://www.w3school.com.cn/html5/html_5_webstorage.asp

大概就这么多吧，其实问题真的不深入，自己感觉得到，但是我对于这些问题都没有准备，实际中也用得比较少，所以心里有点发虚的感觉。两位面试官都很好，有点崇拜感，很谢谢你们，面试的氛围很轻松，哈哈。总结一下吧，技术是个不断熟悉的过程，最好不要中断，有些东西忘掉了需要再捡起来，自己一个多月没怎么写代码了有点手生，今天面试没发挥好。最近也有点沉迷于游戏，自控力有点差，所以LOL在我的电脑For（卸载 in 安装），很是崇拜那种控制力特好的人。经过今天的面试，又找回了学习的动力，又有了鸡血，生活不就是这样吗，有低谷，有斗志昂扬的时候。Fighting Forever!


__EOF__

本文作者：Paxster
本文链接：https://www.cnblogs.com/paxster/p/3382872.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！
posted @   Paxster  阅读(2318)  评论(13)  编辑  收藏  举报
编辑推荐：
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识（上）
阅读排行：
· 单线程的Redis速度为什么快？
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 展开说说关于C#中ORM框架的用法！
· SQL Server 2025 AI相关能力初探
· Pantheons：用 TypeScript 打造主流大模型对话的一站式集成库
点击右上角即可分享
微信分享提示