html如何实现统计访客功能,JS 实时网站访客（用户）统计

JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

var removeUsers = function() {

var list = document.getElementsByClassName("user");

for (var i = list.length - 1; 0 <= i; i--)

if (list[i] && list[i].parentElement)

list[i].parentElement.removeChild(list[i]);

}

// Sample JSON data below since current server is overloaded

var analyticsData = {

"kind": "analytics#realtimeData",

"rows": [

[

"Canada",

"1"

],

[

"France",

"4"

],

[

"Italy",

"1"

],

[

"Poland",

"1"

],

[

"Ukraine",

"1"

],

[

"United Kingdom",

"2"

],

[

"United States",

"15"

]

]

}

/* commenting out for the moment since server is returning 500 error

var updateData = function() {

$.ajax({

'async': false,

'global': false,

'url': "https://ga-real-time-api-data-art.appspot.com/query?id=ahtzfmdhLXJlYWwtdGltZS1hcGktZGF0YS1hcnRyFQsSCEFwaVF1ZXJ5GICAgICAgIAKDA",

'dataType': "json",

'success': function (data) {

analyticsData = data;

}

});

return analyticsData;

};

var analyticsData = (function () {

var analyticsData = null;

$.ajax({

'async': false,

'global': false,

'url': "https://ga-real-time-api-data-art.appspot.com/query?id=ahtzfmdhLXJlYWwtdGltZS1hcGktZGF0YS1hcnRyFQsSCEFwaVF1ZXJ5GICAgICAgIAKDA",

'dataType': "json",

'success': function (data) {

analyticsData = data;

}

});

return analyticsData;

})();

*/

var frag = document.createDocumentFragment();

var updateUsers = function() {

removeUsers();

analyticsData.rows.forEach(function(item) {

var countryName = item[0];

var counterUserNumber = item[1];

// for statement

for (var i = item[1]; i > 0; i--) {

// Creates initial div for each country

var user = document.createElement('div');

// Creates table div

var userContent = document.createElement('div');

// Creates table div

var userTitle = document.createElement('span');

userContent.className = "userContent";

userTitle.innerText = countryName;

userTitle.className = "countryName";

user.appendChild(userContent);

userContent.appendChild(userTitle);

user.className = "user";

frag.appendChild(user);

//end for loop

}

});

document.body.appendChild(frag);

};

updateUsers();

var updateAll = function() {

// Commenting out updateData(); since current server is overloaded

//updateData();

updateUsers();

}

setInterval(updateAll, 60000);