选择正确的元素

Question

当有人将此产品添加到“我的收藏”部分时，我正在尝试使用GTM进行设置。除了“产品名称”，我获得了用于设置事件的所有元素。

URL是这个-> https://www.silversanz.com/categoria/1/subcategoria/10/productos

以下是一些代码：

<article class="product cmp-product   " data-product-id="2166" data-gtm-name="Funda Shockwave anti-impactos iPad 9.7\&quot; Silver HT" data-gtm-id="111943640199" data-gtm-price="24.1879" data-gtm-brand="Silver HT" data-gtm-category="Apple-ipad" data-gtm-variant="" data-gtm-list="Fundas tablets" data-gtm-position="1" id="cmp-product_1" data-state="rendered">
    <a href="/producto/2166" class="product__content-link" title="Funda Shockwave anti-impactos iPad 9.7&quot; Silver HT">
      <section class="product__content">
        <div class="img-wrapper">
          <img alt="Funda Shockwave anti-impactos iPad 9.7&quot; Silver HT | Silver Sanz" src="//s3-eu-west-1.amazonaws.com/silversanz.com/product_images/images/product_images_2533_grid.png?1548836431" class="">
        </div>
        <h4 class="title">Funda Shockwave anti-impactos iPad 9.7" Silver HT</h4>
      </section>
    </a>

<article class="product cmp-product   " data-product-id="519" data-gtm-name="Funda Wave azul marino para iPad Air 1,2, y iPad Pro 9,7\&quot;" data-gtm-id="111933840199" data-gtm-price="19.9892" data-gtm-brand="Silver HT" data-gtm-category="Apple-ipad" data-gtm-variant="" data-gtm-list="Fundas tablets" data-gtm-position="2" id="cmp-product_2" data-state="rendered">
    <a href="/producto/519" class="product__content-link" title="Funda Wave azul marino para iPad Air 1,2, y iPad Pro 9,7&quot;">
      <section class="product__content">
        <div class="img-wrapper">
          <img alt="Funda  iPad Air 1,2,  iPad Pro 9,7" src="//s3-eu-west-1.amazonaws.com/silversanz.com/product_images/images/product_images_1378_grid.png?1528287248" class="">
        </div>
        <h4 class="title">Funda Wave azul marino para iPad Air 1,2, y iPad Pro 9,7"</h4>
      </section>
    </a>

使用tihis代码，我尝试在GTM中制作一个Element Dom变量以使用此元素选择器获得标题-> article＃cmp-product_1.product.cmp-product

但是我的问题是，数字（在这种情况下为1）取决于产品在网格中的位置，因此，对于数字1，该变量仅获得第一个网格产品的名称。

如何正确获得产品名称？

谢谢！

Answer 1

如果您希望CSS选择任何以id开头的元素

cmp-product_

然后选择器是：

[id^="cmp-product_"]

在这种情况下，^=表示以这些字符开头的 任何ID 。

---

关于属性选择器的进一步阅读：

https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors