javascript 利用Image对象实现的埋点(某处的点击数)统计


Posted in Javascript onDecember 28, 2012

需求:统计用户页面某处的点击数或者执行到程序中某个点的次数
特点:根据实际情况,创建多个Image对象,原则谁空闲谁做事。解决因过快发送埋点数据导致部分埋点缺失的问题。
实现:(注下面的代码依赖jQuery)

var Statistic= { 
arrImg:[], 
log:function(from){ 
//如果参数为空,则不处理 
if(typeof(from)=="undefined" || from=="") return; 
var me=this,img,imgHandler,arrImg,len=0,index=-1; 
arrImg=me.arrImg; 
len=arrImg.length; 
//查询可用的Image对象 
for(var i=0;i<len;i++){ 
if(arrImg[i].f==0){ 
index=i; 
break; 
} 
} 
//取出或者生成Image对象 
if(index==-1){ 
img=$(new Image()); 
arrImg.push({f:1,img:img}); 
index=(len==0?0:len); 
}else{ 
img=arrImg[index].img; 
} 
//标记Image对象为正在使用状态 
arrImg[index].f=1; 
//记录所使用的Image对象的位置 
img.data("vid",index); 
imgHandler = function(){ 
var vid=$(this).data("vid"); 
if(vid>=0){ 
arrImg[vid].f=0; 
} 
}; 
img.unbind().load(imgHandler).error(imgHandler); 
var arr = [],ref,url="http://z.ccccccc.com/beacon.gif?"; 
ref = document.referrer; 
if (ref) { 
ref=encodeURIComponent(ref); 
}else{ 
ref=''; 
} 
//必须严格按照以下的先后顺序:t,r,from,version 
arr.push('t='+ (new Date()).getTime()); 
arr.push('r='+ref); 
$(img).attr("src",url+ arr.join('&')); 
} 
};
Javascript 相关文章推荐
img的onload的另类用法
Jan 10 Javascript
Jquery 实现Tab效果 思路是js思路
Mar 02 Javascript
JS Loading功能的简单实现
Nov 29 Javascript
javascript中闭包(Closure)详解
Jan 06 Javascript
移动端滑动插件Swipe教程
Oct 16 Javascript
微信小程序入门教程
Nov 18 Javascript
js仿小米手机上下滑动效果
Feb 05 Javascript
AngularJS实现tab选项卡的方法详解
Jul 05 Javascript
Vue中之nextTick函数源码分析详解
Oct 17 Javascript
使用nvm和nrm优化node.js工作流的方法
Jan 17 Javascript
小程序如何使用分包加载的实现方法
May 22 Javascript
js点击事件的执行过程实例分析【冒泡与捕获】
Apr 11 Javascript
Javascript 加载和执行-性能提高篇
Dec 28 #Javascript
javascript延时加载之defer测试
Dec 28 #Javascript
JavaScript(js)设置默认输入焦点(focus)
Dec 28 #Javascript
Javascript图像处理—平滑处理实现原理
Dec 28 #Javascript
js获取网页高度(详细整理)
Dec 28 #Javascript
前台js改变Session的值(用ajax实现)
Dec 28 #Javascript
window.open的页面如何刷新(父页面)上层页面
Dec 28 #Javascript
You might like
PJBlog插件 防刷新的在线播放器
2006/10/25 Javascript
return false;和e.preventDefault();的区别
2010/07/11 Javascript
Javascript中 关于prototype属性实现继承的原理图
2013/04/16 Javascript
javascript date格式化示例
2013/09/25 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
2014/08/15 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
2014/10/10 Javascript
jQuery中live()方法用法实例
2015/01/19 Javascript
Jquery Ajax xmlhttp请求成功问题
2015/02/04 Javascript
跟我学习javascript的arguments对象
2015/11/16 Javascript
jquery做个日期选择适用于手机端示例
2017/01/10 Javascript
javascript数组去重常用方法实例分析
2017/04/11 Javascript
详解Vue2.X的路由管理记录之 钩子函数(切割流水线)
2017/05/02 Javascript
基于Vue实现支持按周切换的日历
2020/09/24 Javascript
python实现对excel进行数据剔除操作实例
2017/12/07 Python
Python使用Selenium模块模拟浏览器抓取斗鱼直播间信息示例
2018/07/18 Python
Python for循环及基础用法详解
2019/11/08 Python
Python 静态方法和类方法实例分析
2019/11/21 Python
使用Pytorch来拟合函数方式
2020/01/14 Python
TensorFlow 多元函数的极值实例
2020/02/10 Python
彻底搞懂 python 中文乱码问题(深入分析)
2020/02/28 Python
html5指南-7.geolocation结合google maps开发一个小的应用
2013/01/07 HTML / CSS
HTML5实现自带进度条和滑块滑杆效果
2018/04/17 HTML / CSS
html5唤醒APP小记
2019/03/27 HTML / CSS
Maisons du Monde德国:法国家具和装饰的市场领导者
2019/07/26 全球购物
Java中会存在内存泄漏吗,请简单描述
2016/12/22 面试题
经济信息管理专业大学生求职信
2013/09/27 职场文书
做一个有道德的人演讲稿
2014/05/14 职场文书
医院节能减排方案
2014/06/13 职场文书
119消防日活动总结
2014/08/29 职场文书
地震慰问信
2015/02/14 职场文书
追讨欠款律师函
2015/05/27 职场文书
电影红河谷观后感
2015/06/11 职场文书
一文搞懂如何实现Go 超时控制
2021/03/30 Python
vue使用v-model进行跨组件绑定的基本实现方法
2021/04/28 Vue.js
nodejs利用readline提示输入内容实例代码
2021/07/15 NodeJs
JavaScript 与 TypeScript之间的联系
2021/11/27 Javascript