css-selectors - Google 跟踪代码管理器中 "Click Classes"和 "Click Element"之间的差异

Question

我不太明白 Google 跟踪代码管理器中的点击类和点击元素之间的区别。我不了解这些事件的预期用途，也不了解它们各自关于 contains 和 CSS 选择器的行为。

假设我有 class="buttons Primary Small"。

什么有效:

Click Element -> Matches CSS selector -> .buttons.small 
Click Classes -> contains -> small 

什么不起作用:

Click Element -> contains -> .buttons.small 
Click Classes -> Matches CSS selector -> small 

如果 Click Classes 是“对象上的类的数组”，那么在执行此类操作时，GTM 的底层到底发生了什么？

我没有真正的问题，我只是想正确理解它。

Answer 1

Click Classes 返回作为操作目标的 HTML 元素的 class 属性值。它始终是一个字符串，在您的示例中将返回“buttons Primary Small”，但不一定按此顺序。

单击元素返回作为操作目标的 HTML 元素。

“contains”是 GTM 中针对字符串使用的匹配类型。这就是为什么它适用于 Click 类(返回字符串)而不适用于 Click 元素。

“匹配CSS选择器”是检查任何给定元素是否与给定CSS选择器匹配。因此，必须针对 HTML 元素完成“匹配 CSS 选择器”。这就是为什么它适用于 Click 元素而不是 Click 类。

在我看来，点击类是多余的，因为您最好针对点击元素进行 CSS 选择器检查，而不是针对点击类进行字符串匹配。这样更加健壮，而且您也无需担心类名称在类属性值中按特定顺序排列。

换句话说，更好:

点击元素匹配 CSS 选择器 .buttons.primary.small

更糟:

点击类包含主要小按钮