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 相关文章推荐
doctype后如何获得body.clientHeight的方法
Jul 11 Javascript
javascript 弹出层组件(升级版)
May 12 Javascript
formStorage 基于jquery的一个插件(存储表单中元素的状态到本地)
Jan 20 Javascript
jQuery+CSS 半开折叠效果原理及代码(自写)
Mar 04 Javascript
jQuery extend 的简单实例
Sep 18 Javascript
jquery解析xml字符串示例分享
Mar 25 Javascript
JQuery调用绑定click事件的3种写法
Mar 28 Javascript
微信小程序 数据交互与渲染实例详解
Jan 21 Javascript
js动态添加表格逐行添加、删除、遍历取值的实例代码
Jan 25 Javascript
Vuejs 2.0 子组件访问/调用父组件的方法(示例代码)
Feb 08 Javascript
jQuery实现ajax回调函数带入参数的方法示例
Jun 26 jQuery
antd vue 刷新保留当前页面路由,保留选中菜单,保留menu选中操作
Aug 06 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
PHP抓取、分析国内视频网站的视频信息工具类
2014/04/02 PHP
smarty中js的调用方法示例
2014/10/27 PHP
php实现RSA加密类实例
2015/03/26 PHP
Yii+upload实现AJAX上传图片的方法
2016/07/13 PHP
详解Yii2.0 rules验证规则集合
2017/03/21 PHP
PHP实现对xml的增删改查操作案例分析
2017/05/19 PHP
jquery自定义滚动条插件示例分享
2014/02/21 Javascript
利用函数的惰性载入提高javascript代码执行效率
2014/05/05 Javascript
javascript的push使用指南
2014/12/05 Javascript
javascript类型系统 Array对象学习笔记
2016/01/09 Javascript
Javascript实现单例模式
2016/01/24 Javascript
Angular2 (RC5) 路由与导航详解
2016/09/21 Javascript
实例分析浏览器中“JavaScript解析器”的工作原理
2016/12/12 Javascript
完美解决JS文件页面加载时的阻塞问题
2016/12/18 Javascript
js 作用域和变量详解
2017/02/16 Javascript
JavaScript类数组对象转换为数组对象的方法实例分析
2018/07/24 Javascript
微信打开网址添加在浏览器中打开提示的办法
2019/05/20 Javascript
VUE和Antv G6实现在线拓扑图编辑操作
2020/10/28 Javascript
vue实现标签云效果的示例
2020/11/09 Javascript
Python实用日期时间处理方法汇总
2015/05/09 Python
Python的Django框架下管理站点的基本方法
2015/07/17 Python
python万年历实现代码 含运行结果
2017/05/20 Python
python3基于OpenCV实现证件照背景替换
2018/07/18 Python
对python cv2批量灰度图片并保存的实例讲解
2018/11/09 Python
浅谈Python 递归算法指归
2019/08/22 Python
在matplotlib中改变figure的布局和大小实例
2020/04/23 Python
Python限制内存和CPU使用量的方法(Unix系统适用)
2020/08/04 Python
使用CSS3 制作一个material-design 风格登录界面实例
2016/12/12 HTML / CSS
波兰数码相机及配件网上商店: Cyfrowe.pl
2017/06/19 全球购物
乌克兰在线电子产品商店:MTA
2019/11/14 全球购物
一个SQL面试题
2014/08/21 面试题
学生抄作业检讨书(2篇)
2014/10/17 职场文书
2014年护士长工作总结
2014/11/11 职场文书
管理失职检讨书
2015/05/05 职场文书
夏洛特的网观后感
2015/06/15 职场文书
解析MySQL binlog
2021/06/11 MySQL