javascript 统计前端相关元素的动作次数，比如点击及滑过动作，每10次发送一次

本文链接：https://blog.csdn.net/cdcdhj/article/details/120537967

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button id="btn" name="btn">提交表单</button>
		<script language="javascript">
		var LogPack=function(){
			var data=[],//缓存参数数据
			MaxNum=10,//设置次数，达到10次后就发送1次
			itemSplitStr="|",//统计参数间间隔符
			keyValueSplitStr='*',//统计项统计参数与值之间的间隔符
			img=new Image();//创建图片对象
			function sendLog(){
				var logStr='';
				fireData=data.splice(0,MaxNum);//切割数据每10次为发送一次
				for(var i=0,len=fireData.length;i<len;i++){
					logStr+='log'+i+'=';
					for(var j in fireData[i]){
						logStr+=j+keyValueSplitStr+fireData[i][j];
						logStr+=itemSplitStr;
					}
					logStr=logStr.replace(/\|$/,'')+'&';
				}
				logStr+='logLength='+len;
				img.src='a.gif.php?'+logStr;
				saveGame(img.src);
			}
			//因为这里是get发送，所以这里直接跳转到本地浏览器url发送
			function saveGame(src){
				window.location.href=src;
			}
			return function(param){
				if(!param){//没有参数时直接发送返回
					sendLog();
					return;
				}
				data.push(param);//把每次元素动作压缩进data
				data.length>=MaxNum&&sendLog();
			}
		}();
		var btn=document.getElementById('btn');
		btn.onclick=function(){
			LogPack({//下面为参数及参数应该获取的值及动作
				btnId:this.id,
				context:this.innerHTML,
				type:'click'
			});
		};
		btn.onmouseover=function(){
			LogPack({
				btnId:this.id,
				context:encodeURIComponent(this.innerHTML),
				type:'mouseover'
			});
		};
		</script>
	</body>
</html>