Impossibile estrarre l'attributo "valore" dall'elemento +/- box DOM

Question

Desidero estrarre l'attributo "valore" dalla casella di selezione che consente agli utenti di selezionare il numero di quantità di un determinato elemento sul mio sito web.

Sono un principiante di Javascript e HTML. Quando faccio un "Inspect Element" Posso vedere l'attributo nell'elemento

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

Ma quando cerco di fare una delle seguenti due, Google Tag Manager dice la variabile è undefined

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

O

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

L'URL transazione ordine è www.decathlon.in/order

Answer 1

querySelectorAll restituisce un elenco di nodi. È necessario uno:

• recuperare l'elemento rilevante in base all'indice dalla lista:

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

• uso querySelector per selezionare solo un unico elemento:

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

Answer 2

Dal stai usando GTM, perché non usarlo per ciò a cui è destinato (che è quello di alleviare un po 'dalla codifica)? Ecco una soluzione che non richiede alcun codice e utilizza di GTM variabile incorporata DOM:

È possibile impostare per restituire l'attributo value sulla base del selettore CSS per l'elemento input.