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 相关文章推荐
jQuery源码分析-04 选择器-Sizzle-工作原理分析
Nov 14 Javascript
ASP.NET jQuery 实例8 (动态添加内容到DropDownList)
Feb 03 Javascript
用javascript实现自动输出网页文本
Jul 30 Javascript
整理JavaScript对DOM中各种类型的元素的常用操作
May 05 Javascript
webstorm添加vue.js支持的方法教程
Jul 05 Javascript
使用 Node.js 模拟滑动拼图验证码操作的示例代码
Nov 02 Javascript
js统计页面上每个标签的数量实例代码
May 29 Javascript
微信小程序实现之手势锁功能实例代码
Jul 19 Javascript
微信小程序canvas拖拽、截图组件功能
Sep 04 Javascript
为什么要使用Vuex的介绍
Jan 19 Javascript
javascript中join方法实例讲解
Feb 21 Javascript
vue 修改 data 数据问题并实时显示操作
Sep 07 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 a simple smtp class
2007/11/26 PHP
php引用传值实例详解学习
2013/11/06 PHP
PHP代码实现表单数据验证类
2015/07/28 PHP
PHP多维数组排序array详解
2017/11/21 PHP
Laravel框架实现定时发布任务的方法
2018/08/16 PHP
CSS+JS构建的图片查看器
2006/07/22 Javascript
一个小型js框架myJSFrame附API使用帮助
2008/06/28 Javascript
JQuery 学习笔记 element属性控制
2009/07/23 Javascript
一起来写段JS drag拖动代码
2010/12/09 Javascript
关于图片按比例自适应缩放的js代码
2011/10/30 Javascript
jquery实现图片裁剪思路及实现
2013/08/16 Javascript
使用纯JS代码判断字符串中有多少汉字的实现方法(超简单实用)
2016/11/12 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
2016/12/05 Javascript
Cropper.js 实现裁剪图片并上传(PC端)
2017/08/20 Javascript
js设置随机切换背景图片的简单实例
2017/11/12 Javascript
vue.js 双层嵌套for遍历的方法详解, 类似php foreach()
2018/09/07 Javascript
Vue项目history模式下微信分享爬坑总结
2019/03/29 Javascript
在vue中使用echars实现上浮与下钻效果
2019/11/08 Javascript
Node.JS获取GET,POST数据之queryString模块使用方法详解
2020/02/06 Javascript
[46:47]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS NE
2014/05/22 DOTA
[01:01:22]VGJ.S vs OG 2018国际邀请赛淘汰赛BO3 第一场 8.22
2018/08/23 DOTA
Python3基础之list列表实例解析
2014/08/13 Python
Python实现比较扑克牌大小程序代码示例
2017/12/06 Python
django创建最简单HTML页面跳转方法
2019/08/16 Python
如何在mac环境中用python处理protobuf
2019/12/25 Python
解决python图像处理图像赋值后变为白色的问题
2020/06/04 Python
Puritan’s Pride(普丽普莱)官方网站:美国最大最全的保健品公司之一
2016/10/23 全球购物
世界上最大的艺术和工艺用品商店:MisterArt.com
2018/07/13 全球购物
英国家电购物网站:Sonic Direct
2019/03/26 全球购物
SQL Server 2000数据库的文件有哪些,分别进行描述
2013/03/30 面试题
追悼会主持词
2014/03/20 职场文书
优秀员工推荐材料
2014/12/20 职场文书
爱护环境卫生倡议书
2015/04/29 职场文书
2016年母亲节广告语
2016/01/28 职场文书
Ajax是什么?Ajax高级用法之Axios技术
2021/04/21 Javascript
利用Python多线程实现图片下载器
2022/03/25 Python