谷歌标签管理器：在特定文本后获取值作为变量答案

【问题标题】：Google Tag Manager: get value as variable after specific text谷歌标签管理器：在特定文本后获取值作为变量
【发布时间】：2016-11-30 20:07:52
【问题描述】：

我正在尝试将“sku”的值捕获为 GTM 中的变量。这个值会在每个产品页面上发生变化。

页面上的代码如下所示：

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Product",
  "sku": "305FS-UJNA5",
  "offers": [{
        "@type": "Offer",
        "price": "99.00",
        "availability": "InStock",
        "priceCurrency": "USD"
        }]
}
</script>

预计要捕获的变量：305FS-UJNA5（不带双引号）。

有没有办法通过使用自定义 javascript 变量类型来实现此目的，该变量类型将在页面上搜索 "sku": " 并返回值直到下一个双引号？

或者，最好的方法是什么？

我已经尝试过搜索，但在 GTM 中返回 undefined...

function () {
var content = document.body.innerText;
var query=""sku": "";
if (content.search(query) > -1 ) {
    return true;
} else {
    return false;
    }
}

【问题讨论】：

为什么不利用 GTM 并将您需要的数据推送到 dataLayer 中呢？（并不是说你的方法是错误的，但是......只是把它扔在那里，因为你已经有了 GTM。）
@nyuen 如果它在 dataLayer 中，那就太棒了。但是如何让 GTM 读取 305FS-UJNA5 的值并将其推送到 dataLayer？
您需要对键/值对进行dataLayer.push。如果不将其放入可能无济于事的答案中，我将无法向您展示更多内容。但是你可以谷歌数据层推送。您可以使用event 来执行此操作，以便 GTM 可以轻松获取数据并在您的标签中使用它们。
删除了我的答案，因为我认为它不相关（还）。我认为其中一个问题是您的结构化数据不容易访问。例如，如果它有一个 ID，那么你可以按照这个：autoidlabs.org.uk/GS1Digital/Demos/GS1vocab/…。我不确定您如何才能访问它。

标签： javascript google-tag-manager

【解决方案1】：

如果你准备接受一个骇人听闻的解决方案

      <html>
        <head>
            <title></title>
                <script type="application/ld+json">
        {
          "@context": "http://schema.org",
          "@type": "Product",
          "sku": "305FS-UJNA5",
          "offers": [{
                "@type": "Offer",
                "price": "99.00",
                "availability": "InStock",
                "priceCurrency": "USD"
                }]
        }
        </script>
        </head>
        <body>
            <script>    
            json = {};
                scripts = document.getElementsByTagName('script');
                for (i = 0; i < scripts.length; ++i) {
                  script = scripts[i];
                  if(script.getAttribute('type') != "application/ld+json") {
                      continue;
                  }
                  json = JSON.parse(script.childNodes[0].nodeValue);
                  datalayer.push({ // dl must be initialized before
                    'event':'skuCapture',
                     'sku': json.sku
                  });
                }


            </script>
        </body>
        </html>

这会将 script-Tag 的内容加载到名为“json”的变量中，您可以将其加载到全局 js 变量中或将单个属性推送到数据层（即在示例中 json.sku 将保存 sku）。如果您不对现有事件（例如 Dom Ready）执行此操作，则需要推送自定义事件以使 GTM 知道该值。

如果您无法更改页面代码，显然您可以将脚本放在自定义 HTML 标记中（只要它在您的脚本标记呈现后运行）。这只是一个工作示例。

这在 Chrome 中对我有用，它没有在其他浏览器上测试过，也没有测试过副作用，所以你可能需要扩展这个想法，但它是可行的（即使它看起来很丑）。

其实这个可以写得简洁一点：

var scripts = document.querySelectorAll("[type='application/ld+json']");
    for (i = 0; i < scripts.length; ++i) {
      script = scripts[i];
      json = JSON.parse(script.childNodes[0].nodeValue);
      console.log(json.sku);
    }

只选择具有正确类型属性的脚本标签。如果你确定你只有一个脚本标签，你可以使用document.querySelector 而不是document.querySelectorAll 并省去循环（因为这会返回一个结果）。

【讨论】：

好答案！我以为可能有另一种方式，但我想没有。
@nyuen，我真的希望有另一种方法，因为这肯定不是一个漂亮的解决方案 - 但这是我能找到的唯一一个。
可能也一样，因为 OP 不想让开发人员参与进来。