阿里校招:前端线上笔试题--计算鼠标在页面某个区域内的停留时长

校招:阿里前端笔试题
收到笔试通知后恶补了几天阿里前端历年笔试题,巧的是这道题今年有同学做过,而且发到了北邮人bbs上(看来临阵磨枪还是有用的),现在贴上当时提交的代码。

水平有限,有错误烦请指点。

题目:

    <div class=‘mod-spm‘data-spmid=‘123‘>
        <divclass=‘child_a‘></div>
        <divclass=‘child_b‘></div>
        <divclass=‘child_c‘></div>
        <divclass=‘child_d‘></div>
    </div>
    <divclass=‘mod-spm‘ data-spmid=‘456‘>
        <divclass=‘child_a‘></div>
        <divclass=‘child_b‘></div>
        <divclass=‘child_c‘></div>
        <divclass=‘child_d‘></div>
    </div>
    <divclass=‘mod-spm‘ data-spmid=‘789‘>
        <divclass=‘child_a‘></div>
        <divclass=‘child_b‘></div>
        <divclass=‘child_c‘></div>
        <divclass=‘child_d‘></div>
    </div>
有dom结构如上,请用原生代码(禁用jQuery作答)实现以下功能:
(a)计算鼠标在mod-spm区域内的停留时长,data-spm不同视为不同区域
(b)尽量减少性能损耗
(c)重复进入计时累加

代码如下:

<html>
<head>
</head>
<body>
    <div class=‘mod-spm‘ data-spmid=‘123‘ onmouseover="fun(this.dataset.spmid)" onmouseout = "funstop()">
        <div class=‘child_a‘></div>
        <div class=‘child_b‘></div>
        <div class=‘child_c‘></div>
        <div class=‘child_d‘></div>
    </div>
    <div class=‘mod-spm‘ data-spmid=‘456‘ onmouseover="fun(this.dataset.spmid)" onmouseout = "funstop()">
        <div class=‘child_a‘></div>
        <div class=‘child_b‘></div>
        <div class=‘child_c‘></div>
        <div class=‘child_d‘></div>
    </div>
    <div class=‘mod-spm‘ data-spmid=‘789‘ onmouseover="fun(this.dataset.spmid)" onmouseout = "funstop()">
        <div class=‘child_a‘></div>
        <div class=‘child_b‘></div>
        <div class=‘child_c‘></div>
        <div class=‘child_d‘></div>
    </div>
</body>

<script type="text/javascript">
      var w=new Worker("../workers.js");//使用HTML5 Web Workers属性
      function fun(curid){ //Init
          w.postMessage(curid);//The Worker.postMessage() method sends a message to the worker‘s inner scope. This accepts a single parameter, which is the data to send to the worker.
      }
      function funstop(){
          w.postMessage(0);//设置id为0,不计数
      }
</script>

<html>

  //worker.js  后台文件
  var timers = new Array();
  var  i = 0;
  var id = 0;
  function timedCount()
  {
      if(id == 0) return;
      if(timers[id] == undefined){
          timers[id] = 0;
      }
      setTimeout("timedCount()",1000);//每隔一秒累加器+1;
      timers[id] ++;
  }
  onmessage = function(spmid){
    id = spmid.data;  /*the onmessage callback for a Web Worker*/
  }
时间: 2024-10-25 21:00:51

阿里校招:前端线上笔试题--计算鼠标在页面某个区域内的停留时长的相关文章

阿里校招:前端线上笔试题--页面中的一个元素(10px*10px)围绕坐标(200, 300) 做圆周运动

题目: 请让页面中的一个元素(10px*10px)围绕坐标(200, 300) 做圆周运动: <html> <head> <style type="text/css"> .item{ width:20px; height:20px; border-radius:10px; background: blue; position: absolute; }/*border-radius圆角半径*/ #point{ left:95px; top:295px;

阿里2014前端线上笔试题目(答案待补充)

题目及部分答案转载自 WEB前端开发(www.css119.com) No.1 下图绿色区域的宽度为100%,其中有三个矩形,第一个矩形的宽度是200px,第二个和第三个矩形的宽度相等.请使用 css3 中的功能实现它们的布局. 已知 html 结构是: <div>  <div>column 1</div>  <div>column 2</div>  <div>column 3</div> </div> 答案:

【美团点评】2020校招算法工程师方向笔试题

这套题难啊..好多坑点.而且想了好久.交卷两小时..想了一晚上. 第一题还是不知道怎么dp的..可能要坑一下明天补.. 如果有大佬能指点下我就更好了QAQ.我是真的菜.. 试题链接:2020校招算法工程师方向笔试题 5. 外卖小哥的保温箱 题意:众所周知,美团外卖的口号是:”美团外卖,送啥都快”.身着黄色工作服的骑手作为外卖业务中商家和客户的重要纽带,在工作中,以快速送餐突出业务能力:工作之余,他们会通过玩智力游戏消遣闲暇时光,以反应速度彰显智慧,每位骑手拿出装有货物的保温箱,参赛选手需在最短的

hive计算网页停留时长

hive表结构例如以下: create table pv_user_info( session_id string, user_id string, url string, starttime bigint ); 主要就是这几个字段实用.省略其它. 实现方式:userid和sessionid分组后并按时间降序排序,降序排序后.第一行就是该用户最后一次浏览的网页.最后一行是第一次浏览的网页,第一行的starttime和第二行的starttime相减就是第二行停留时间. 这里会有几个误差 用户最后一

2015年阿里巴巴校招研发工程师在线笔试题汇总

在线笔试题汇总 卷一: 1.下面的函数中哪个是系统调用而不是库函数______? printf scanf fgetc read print_s scan_s 2.某足球队有四名外援,分别来自巴西.荷兰.意大利和美国.他们分别擅长前锋.后卫或守门,其中: ① 美国外援单独擅长守门: ② 意大利外援不擅长前锋: ③ 巴西外援和另外某个外援擅长相同的位置: ④ 荷兰外援擅长的位置和巴西外援不同. 以上条件可以推出巴西外援擅长的位置是______. 前锋 守门 后卫 前锋或守门 后卫或守门 前锋或后卫

腾讯的2014年校招的软开笔试题(转)

转:http://blog.csdn.net/zs634134578/article/details/20938113 考试时长:120分钟 一 不定项选择题(共25题,每题4分,共100分,少选.错选.多选均不得分) 1 已知一棵二叉树,如果先序遍历的节点顺序是:ADCEFGHB,中序遍历是:CDFEGHAB,则后序遍历结果为:() A.CFHGEBDA   B.CDFEGHBA   C.FGHCDEBA   D.CFHGEDBA 解析:由先序遍历序列和中序遍历序列可以唯一确定树的结构 步骤:

2015阿里实习线上笔试题-附加题1

随机数生成器 计算机使用的随机数生成器往往是伪随机的,为了达到统计意义上的真随机数,可以需要引入系统 外的变量等作为随机种子(如UNIX系统中熵池).假设有一天出现了上帝的投硬币函数: int G(); 由于这里用到的上帝硬币可能不均匀.但可以保证是G()可以x概率返回1,1-x的概率返回0,其中x为未知常数(且x不等于0或1). 请实现目标函数: int F(double p); 要求 F函数以概率p返回1,以1-p返回0. 除了G之外,不使用的任何库函数. PS:定义宏UINT_MAX=0x

阿里2015在线研发工程师笔试题(部分)

今天lz去阿里的在线笔试打了一把酱油,由于lz的水平有限,时间太他么紧张了.下面把记下来的题给大家分享一下.选择题总共20道,前十题截了图,后面感觉太费时就没有再截了,凭记忆记下了两道.附加题都记录下来了. 选择题 第1题: 第2题: 第3题: 第4题 第5题: 第6题: 第7题: 第8题: 第9题: 第10题: 回忆起来的题(11-20中的某2道) 1.       一个博物馆,以每分钟20人的速度进入,平均每人待20分钟,问博物馆最少需要容纳多少人? A.100 B.200  C.300 

2015年阿里研发工程师实习在线笔试题

投递了阿里的C/C++方向研发,昨天晚上参加在线笔试时完全懵了,各种数学题.智力题,以及各种看似风马牛不相及的题目在一起,各位感受下. 题目中涉及到排列组合 基本数学问题等.下面关于以上部分题目给出自己的意见,如果有不对的地方,希望各位指正. 关于数N!有多少个零 思路:给定一个整数N,那么N的阶乘N!末尾有多少个0的问题可以转换为N!乘式中可以分解出多少个5的问题.因为5和其前面的任何一个偶数相乘都会产生0,所以只需求出在由1到N的数中共可以分解出多少个5.例如25!,可以分解出5(1×5).