Obtenir la valeur de la valeur Entrée

document.getelementsbyNameName code> ne signifie pas l'attribut nom de nom de l'entrée HTML d'entrée.

Cela signifie l'utiliser par nom d'entrée comme ceci: p> xxx pré> Mais ce n'est pas de votre utilisation car il sera tous les trois éléments, vous pouvez utiliser document.getelementByID. code> Veuillez trouver l'exemple ci-dessous: p>

let userInput = document.getElementsByName('money-amount');
inputNum = parseInt(userInput.value);

console.log(inputNum) 

c'est-à-dire parce que document.queryselectorall () code> renvoie une nodéliste. Cela signifie que vous devez parcourir la liste avant de tenter d'accéder à la valeur des éléments individuels. Étant donné que tous vos éléments d'entrée ont la classe de l'argent de la classe code>, vous pouvez utiliser le sélecteur pour récupérer toutes leurs valeurs: xxx pré>

pour collecter toutes leurs valeurs, vous serez probablement doivent les cartonnez-les sur un tableau, pour lequel vous pouvez le faire: p> xxx pré>

Voir exemple de la preuve de concept: p>

p>

<input class="input money" type="number" id="money-amount" placeholder="Enter amount" name="moneyamount" required value="123" />
<input class="input money" type="number" id="money-amount1" placeholder="Enter amount" name="moneyamount" required value="456" />
<input class="input money" type="number" id="money-amount2" placeholder="Enter amount" name="moneyamount" required value="789" />

<button type="button" id="btn">Get money amounts</button>

Chaque fois que vous souhaitez accéder à plusieurs éléments avec une requête, vous devez essayer d'utiliser la classe code> pas ID code> ou nom code>

id code> & nom code> doit être unique dans chaque page p>

p>

<input
        class="input money"
        type="number"
        id="money-amount"
        placeholder="Enter amount"
        name="moneyamount"
        value="1"
        required
      />
      <input
        class="input money"
        type="number"
        id="money-amount1"
        placeholder="Enter amount"
        name="moneyamount"
        value="2"
        required
      />
      <input
        class="input money"
        type="number"
        id="money-amount2"
        placeholder="Enter amount"
        name="moneyamount"
        value="3"
        required
      />

document.queryselectorall () renvoie une nodelle. Lorsque vous utilisez document.QuerySelectorall ("entrée") , les trois nœuds reviennent dans un format de NODELIST:

[entrée # argent-amount.input.money, entrée. # Money-Amount1.input.money, entrée # Money-Amount2.input.money]


où # représente l'identifiant de l'élément et. représente la classe de l'élément. Les éléments individuels peuvent ensuite être accessibles en utilisant leurs index. IE document.QuerySeletorall ("entrée") [0] vous donnerait le premier élément de la nodelle, document.QuerySeletorall ("entrée") [1] vous donnerait Le deuxième élément, etc. Les index peuvent également être définis comme des constantes, ce qui est beaucoup plus facile à lire que d'utiliser 0,1,2.
Par exemple, Const coûte = 0, document.QuerySelectorall ("Entrée") [COÛT] .

Vous pouvez tester les commandes dans la console des outils de développeur Chrome. Cela vous donnera un meilleur visuel de quels éléments sélectionnés et quelles valeurs reviennent en appelant différentes méthodes.