javascript - 循环遍历表以返回 Google Analytics 电子商务中 _addItem() 的交易信息

Question

我正在尝试设置电子商务网站的收据页面以将电子商务数据推送回 Google Analytics。我坚持使用 sku、名称、价格和购买的每件商品的数量填充 _addItem() 方法。

我需要为收据上的每件元素提供以下信息:

_addItem(transactionId, sku, name, price, quantity)

我的收据页面使用产品数据生成下表。如何使用 Javascript 或 jQuery 遍历此表以返回每个项目的以下内容？收据上可以包含的元素数量没有限制。

<div id="receipt_detail">
   <table class="list_container" width="98%" cellspacing="0" cellpadding="4" >
     <tr class="list_heading">
        <td align="left"  nowrap >SKU</td>
        <td align="left"  nowrap >Description</td>
        <td align="left"  nowrap >Qty</td>
        <td align="right"  nowrap >Price</td>
        <td align="right"  nowrap >Extended</td>
     </tr>
     <tr class="list">
        <td align="left"  nowrap >1234</td>
        <td align="left"  nowrap >Widget 1</td>
        <td align="left"  nowrap >1</td>
        <td align="right"  nowrap > $            0.25</td>
        <td align="right"  nowrap > $            0.25</td>
     </tr>
     <tr class="listodd">
        <td align="left"  nowrap >5678</td>
        <td align="left"  nowrap >Widget 2</td>
        <td align="left"  nowrap >1</td>
        <td align="right"  nowrap > $            0.10</td>
        <td align="right"  nowrap > $            0.10</td>
     </tr>
   </table>
</div>

我已经涵盖了 transcationId(这很容易)。其余的让我难过。我是 Javascript 的新手，所以非常感谢任何帮助。

Google 关于电子商务跟踪代码的开发者文档是 here .

Answer 1

您将不得不填写一些空白，但这里有一些代码可以从您的表格中提取值并填充 GA 代码:

<script language="JavaScript" type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-11111-1']); // your account # here

(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

/* you proved no details or examples of where to get any of this, so this is
   the GA manual example */
_gaq.push(['_addTrans',
  '1234',           // transaction ID - required
  'Womens Apparel', // affiliation or store name
  '28.28',          // total - required
  '1.29',           // tax
  '15.00',          // shipping
  'San Jose',       // city
  'California',     // state or province
  'USA'             // country
]);

/* scrape the html you provided and add values to _addItem */
$(document).ready(function() {
  $('div#receipt_detail tr.list,.listodd').each(function() {
    var info = [];
    $(this).find('td').each(function() {
      info.push($(this).html().replace(/^\s*\$\s*/,''));      
    });
    _gaq.push(['_addItem',
      '1234',                // transaction ID 
      info[0]||'no sku',     // SKU/code - required
      info[1]||'no product', // product name
      'category',            // category or variation
      info[3]||'0',          // unit price - required
      info[2]||'1'           // quantity - required
    ]);
  });
  _gaq.push(['_trackTrans']);
});

</script>

注意:这并不是跟踪交易的好方法。与其尝试从页面中抓取系统显然已经动态输出的值，不如使用服务器端代码更直接地向 js 公开必要的值，最好只是使用服务器端代码动态填充 GA 代码。