Attribut "value" kann nicht aus +/- Box extrahiert werden DOM-Element

Question

Ich möchte das Attribut "value" aus der Auswahlbox extrahieren, mit dem Benutzer die Anzahl der Mengen eines bestimmten Artikels auf meiner Website auswählen können.

Ich bin ein Neuling zu Javascript und HTML. Wenn ich ein „Inspect Element“ Sie kann ich das Attribut in dem Element sehen

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

Aber wenn ich versuche, eine der folgenden zwei, Google Tag Manager zu tun, sagt die Variable undefined

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

OR

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

Der Bestellvorgang URL ist www.decathlon.in/order

Answer 1

querySelectorAll gibt eine Liste der Knoten zurück. Sie müssen entweder:

• das entsprechende Element von Index aus der Liste abrufen:

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

• Verwendung querySelector nur ein einzelnes Element wählen:

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

Answer 2

Seit Sie verwenden GTM, warum verwenden Sie es nicht für das, wofür es gedacht war (was soll Sie etwas vom Codieren entlasten)? Hier ist eine Lösung, die keinen Code und verwendet GTM-internen DOM Variable erfordert:

Sie können es die value Attribut basiert auf dem CSS-Selektor für das input Element zurückzukehren.