Stack Overflow Asked by SMSO on November 30, 2020
Code is as follows:
<div class="empty player card3">6 Spades</div>
<div class="empty player card4">10 Hearts</div>
I need to add the numbers (6 & 10 in this case) together for a score count. How would I do this in JavaScript in a function?
Edit: forgot to add that the "number" could be J, Q, K, or A (10,10,10,11). Would there be a quick convert for this as well?
Guessing and filling-in the blanks from your question,
I've coded a function to add cards.
It takes three arguments:
empty
: should it look for class empty
?who
: for example, "player"
.cardNumbers
: for example, [3, 4]
.It takes the substring before the first space of all the div's that match the classes and card numbers' text content, and stores in a temporary array values
.
It then sums, with initial value 0
, 10 for JQK, 11 for A, and number value for the rest - +String
is the shortest way to get a Number out of a number string.
function cardsValue(empty, who, cardNumbers) {
var values = cardNumbers.map(
currentValue => document.querySelector(
(empty?".empty":"") +
("." + who) +
(".card" + currentValue)
)
.textContent
.split(" ")
[0]
);
return (
values.reduce(
(accumulator, currentValue) => {
accumulator +=
["J", "Q", "K"].includes(currentValue)?10:
currentValue == "A"?11:
+currentValue;
return accumulator;
}, 0
)
);
}
console.log("Player: "+cardsValue(true, "player", [3, 4]));
console.log("Computer: "+cardsValue(true, "computer", [9, 10,11]));
<div class="empty player card3">6 Spades</div>
<div class="empty player card4">10 Hearts</div>
<br>
<div class="empty computer card9">K Diamonds</div>
<div class="empty computer card10">A Clubs</div>
<div class="empty computer card11">7 Diamonds</div>
Array.prototype.map()
Array.prototype.reduce()
Conditional (ternary) operator
String.prototype.split()
Node.textContent
I don't know if class empty
is important for selection,
Nor the card number.
If not: you can sum all "player"
, "computer"
, "player2"
, etc.:
function cardsValue(who) {
var divs = Array.from(document.querySelectorAll("." + who));
var values = divs.map(
currentValue =>
currentValue
.textContent
.split(" ")
[0]
);
return (
values.reduce(
(accumulator, currentValue) => {
accumulator +=
["J", "Q", "K"].includes(currentValue)?10:
currentValue == "A"?11:
+currentValue;
return accumulator;
}, 0
)
);
}
console.log("Player: "+cardsValue("player"));
console.log("Computer: "+cardsValue("computer"));
<div class="empty player card3">6 Spades</div>
<div class="empty player card4">10 Hearts</div>
<br>
<div class="empty computer card9">K Diamonds</div>
<div class="empty computer card10">A Clubs</div>
<div class="empty computer card11">7 Diamonds</div>
Correct answer by iAmOren on November 30, 2020
Use split()
to make sure you get the numeric part, then parseInt(value, 10)
, to parse a value
using a base-10 system. If you fail to split and identify the numeric part, you'll possibly get NaN
for a value like "joker". If you're not sure where the number is, you'll need to forEach()
the results of split(' ')
and use isNan()
to find the number. And, if you don't indicate 10
, you could get a base-8 answer...
If the input string begins with "0" (a zero), radix is assumed to be 8 (octal)... (Source: Developer.Mozilla.org)
console.log(parseInt(document.getElementById("6ofspades").innerHTML.split(' ')[0], 10));
console.log(parseInt(document.getElementById("10ofhearts").innerHTML.split(' ')[0], 10));
<div id="6ofspades" class="empty player card3">6 Spades</div>
<div id="10ofhearts" class="empty player card4">10 Hearts</div>
Answered by HoldOffHunger on November 30, 2020
Please take this way:
function addCardNumbers() {
const card3 = document.querySelector(".empty.player.card3");
const card4 = document.querySelector(".empty.player.card4");
return parseInt(card3.textContent) + parseInt(card4.textContent);
}
Answered by Everest Climber on November 30, 2020
function addCardNumbers() {
const card3 = document.querySelector(".empty.player.card3");
const card4 = document.querySelector(".empty.player.card4");
// Remove every non-digit character from the text
// and convert them to numbers
const card3Number = Number(card3.textContent.replace(/D/g, ""));
const card4Number = Number(card4.textContent.replace(/D/g, ""));
return card3Number + card4Number;
}
Answered by Pedro Thomé on November 30, 2020
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP