Javascript 希望将面包屑数据拉入GTM
在一个我正忙着标记的网站上,坐着这个凌乱的小面包屑Javascript 希望将面包屑数据拉入GTM,javascript,google-tag-manager,Javascript,Google Tag Manager,在一个我正忙着标记的网站上,坐着这个凌乱的小面包屑 <div class="col-xs-12 col-md-12"> <nav id="breadcrumbs"> <div class="breadcrumbs"> <ul itemscope="" itemtype="http://schema.org/BreadcrumbList"> li class="home" itemprop="item
<div class="col-xs-12 col-md-12">
<nav id="breadcrumbs">
<div class="breadcrumbs">
<ul itemscope="" itemtype="http://schema.org/BreadcrumbList">
li class="home" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a href="https://www.twt.co.za/" title="Go to Home Page" itemprop="item">Home </a>
<span>/ </span>
<meta itemprop="name" content="Home">
<meta itemprop="position" content="1">
</li>
<li class="category161" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a href="https://www.twt.co.za/wheels" title="" itemprop="item">Wheels </a>
<span>/ </span>
<meta itemprop="name" content="Wheels">
<meta itemprop="position" content="2">
</li>
<li class="category691" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a href="https://www.twt.co.za/by-wheel-size" title="" itemprop="item">By Wheel Diameter </a>
<span>/ </span>
<meta itemprop="name" content="By Wheel Diameter">
<meta itemprop="position" content="3">
</li>
<li class="category708" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<strong>17 Inch Wheels </strong>
<meta itemprop="name" content="17 Inch Wheels">
<meta itemprop="position" content="4">
</li>
</ul>
</div>
</nav>
我想将面包屑的第二和第三个元素捕获到GTM中的两个变量中。在这种情况下,将车轮作为类别,并将车轮直径作为子类别
在这里找到了一些只处理从面包屑中提取url的示例,因此我显然没有能力将其改写为JavaScript
这有点牵强,我可能会因此而受到打击,但我觉得如何从网站上获得一个干净的类别和子类别标识符非常困难,理论上这是最好的方法。当涉及到这么多的元素时,有点迷失了
function() {
var bcLink = document.getElementsByClassName("breadcrumbs");
var data = [];
for (i=0; i<bcLink.length; i++) {
data.push({ 'category' : bcLink[i].getAttribute("name") });
}
return data;
}
您可以使用以下代码创建一个标记,将信息推入数据层,然后创建两个单独的数据层变量来提取信息
<script>
function breadcrumbLevel() {
var bcLink = document.querySelectorAll(".breadcrumbs li a");
if(typeof bcLink != 'undefined'){
var data = [];
for (i=0; i<bcLink.length; i++) {
data.push(bcLink[i]);
}
var bLevel1 = data[1].innerText;
var bLevel2 = data[2].innerText;
dataLayer.push({'breadcrumbLevel2': bLevel1,
'breadcrumbLevel3': bLevel2
});
}
}
breadcrumbLevel();
</script>