masking and input value with javascript

in your js script try this

import validator from './validator.js';
//accediendo al input text
let numeroDom = document.getElementById('numeroTarjeta')
let numero = numeroDom.value
numeroDom.innerHTML = validator.maskify(numero)
if (validator.isValid(numero) === true) {
    let tarjeta_valida = document.createElement('div')
    tarjeta_valida.setAttribute('div', 'tarjetaValida')
    let div_tarjeta = document.querySelector('.tarjeta')
    div_tarjeta.appendChild(tarjeta_valida)
} else {
    let tarjeta_invalida = document.createElement('div')
    tarjeta_invalida.setAttribute('div', 'tarjetaInvalida')
    let div_tarjeta = document.querySelector('.tarjeta')
    div_tarjeta.appendChild(tarjeta_invalida)
    
}


console.log(numero)

console.log(validator);

Explainin: getElementById render a dom object which is the html object which you can use with (innerHTML and other features) so you were getting in numero the value of dom, then you want to use with this value (int) the innerHTML so what we did is to get the dom then retreive its value so we put in the dom's html the maskify of its value

i hope this was helpful for you

in the numero variable, you are getting the value

value is the string you get from the input

value isn't the input itself on the DOM

so you need to also add another variable with the DOM element

const numberoEl = document.getElementById('numeroTarjeta'); // <input>
const numero = numeroEl.value;                              // 13589294579294

also in the input don't use type="text",

but use type="tel" or use type="number"

which is good because gives the user a good keyboard,
and saves you from a lot of checking
because with input number we can't insert a letter
and so in javascript, you don't have to check if all numbers match a certain regex.

so with this code, when focusing you will have this correct keyboard automatically.

<input 
  id="numeroTarjeta" 
  type="number" 
  placeholder="Introduce tu numero de tarjeta"
>