0
我一直负责创建纯JS内部促销跟踪器,并通过GTM实现此功能。我不确定我是以非常复杂的方式完成的,还是不愿意提出任何建议!Google Tag管理器中的纯JavaScript内部促销
目前我有以下标签:
此功能可以检查一个元素,以后引用,中视
function isInViewport(element) {
var rect = element.getBoundingClientRect();
var html = document.documentElement;
return (
rect.top >= 0 &&
rect.left >= 0 &&
rect.bottom <= (window.innerHeight || html.clientHeight) &&
rect.right <= (window.innerWidth || html.clientWidth)
);
}
然后我抓住所有的元素的页面上,我想要检查在视图中,并将它们推入一个数组中。
这是我用来做这件事的脚本。注:我已经在列表上执行了模数除法,因为页面上还有其他项目满足该选择器,但我只想选择每个第5项。
var id = document.getElementById('foo');
var list = id.getElementsByTagName('ba');
var items = [];
var position = [];
var j = 1;
for (var i = 0; i < list.length; i++) {
if (i % 5 == 0) {
items.push(list[i]);
j = j + 1;
}
}
然后我要检查,如果这些元素都是在用户视口中他们时滚动使用下面的脚本建设被推送到数据层的电子商务对象:
window.onscroll = myfunction;
var ecommerceObject;
var event;
function myfunction() {
for (var i = 0; i < cars.length; i++) {
if (isInViewport(list[i]) === true) {
ecommerceObject['ecommerce']['promoView'] = {
'event' : 'promoview',
'promotions': [{
'id': items[i].innerText.split("\n")[1],
'name': items[i].id
}]
};
window.dataLayer.push(ecommerceObject);
}
}
}
我的问题现在是每当我滚动我反复检查所有满足我的选择器的项目意味着,直到一个项目不在视口中,我将同一个项目推到dataLayer多次。
反正是有,我可以:
A - 停止具有相同的项目推到数据层每次用户滚动,只有已将其推一次
乙 - 凝聚我的代码,以便它不是在三个独立的脚本
非常感谢花时间来看这个!