ok I get that \d is digits from 0-9, 1e2 ===100 ( is it equal 100 because after the e there’s 2 so I add 2 zeros after the 1?), but I still don’t get what does (\d+e\d+/i) mean? There’s 2 \d seperated by an e which I guess it means a million? any number from0-9 + e another 0-9 which can max out at 9 999 999 999, is this correct? And the +/i I don’t know what that does.
The HTML input element has built-in “validation” which only allows for numbers to be typed in, but it also allows for an “e” between two numbers (it actually allows an e at the start as well but never mind that) because that is a valid form of number notation.
We do however not want to allow such an input. So we match on one or more numbers followed by the character e followed by one or more numbers, using a case-insensitive search. If we match on the input we (later in the code) will reject it as an invalid input.
We are basically just augmenting the built-in validation with an extra check for “numbers e numbers” as an invalid input.
We then get all the input elements using querySelectorAll.
It returns a NodeList which is an array-like structure and just like a normal array it has a length property. We can use that to “count” the number of elements and we use that count in the template literal to give a number to each of the elements we add. Every time we add more elements the number increases.
We then construct the template literal, using the option value and count for the element attributes.
Then we add the new elements we created in the template literal to the .input-container element we selected on the first line in the function.
Yes, entryNumber is the number of input[type="text"] elements. So it will increase/decrease as elements are added or removed.
HTMLString is the template literal that contains the constructed HTML. Using template literals you can write a string that contains HTML and add it to the DOM as HTML. It is used instead of having to use createElement and then adding values and attributes to the created elements.