Google Tag管理器中的純JavaScript內部促銷

我一直負責創建純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 - 停止具有相同的項目推到數據層每次用戶滾動，只有已將其推一次

乙 - 凝聚我的代碼，以便它不是在三個獨立的腳本

非常感謝花時間來看這個！

來源

2017-01-12 L Galliers

A）你可以使用一個布爾值來檢測，如果數據層推已execued如下：

window.onscroll = myfunction; 
var ecommerceObject; 
var event; 
var done = false; // example of a new variable 
function myfunction() { 
    for (var i = 0; i < cars.length; i++) { 
     if (isInViewport(list[i]) === true && !done) { //execute only if NOT done 
      done = true; //set done to true 
      ecommerceObject['ecommerce']['promoView'] = { 
       'event' : 'promoview', 
       'promotions': [{ 
        'id': items[i].innerText.split("\n")[1], 
        'name': items[i].id 
       }] 
          }; 
      window.dataLayer.push(ecommerceObject); 
     } 
    } 

}

B）什麼是第一個地方，你有它的原因在3個不同的腳本？

來源

2017-01-16 16:58:19 Matus

Google Tag管理器中的純JavaScript內部促銷

回答

相關問題