无法从 +/- 框 DOM 元素中提取 "value" 属性

Question

我想从 selection 框提取 "value" 属性，它允许用户 select 我网站上特定项目的数量。

我是 Javascript 和 HTML 的新手。当我执行 "Inspect Element" 时，我可以在元素

中看到属性

<input size="2" type="text" autocomplete="off" class="cart_quantity_input form-control grey" value="2" name="quantity_8329349_28095_0_12035">

但是当我尝试执行以下两个操作之一时，Google 跟踪代码管理器说变量是 undefined

document.querySelectorAll("input.cart_quantity_input.form-control.grey").value

或

document.querySelectorAll("input.cart_quantity_input.form-control.grey").getAttribute("value")

订单交易URL为www.decathlon.in/order

Answer 1

querySelectorAll returns 节点列表。您需要：

• 从列表中按索引检索相关元素:

  document.querySelectorAll("input.cart_quantity_input.form-control.grey")[0].value
  

• 使用querySelector到select只有一个元素：

  document.querySelector("input.cart_quantity_input.form-control.grey").value
  

Answer 2

既然您使用的是 GTM，为什么不将其用于预期用途（这是为了减轻您的编码负担）？这是一个不需要代码并使用 GTM 内置 DOM 变量的解决方案：

您可以根据 input 元素的 CSS 选择器将其设置为 return value 属性。