Problema al usar parseFloat a pesar de que estoy analizando un número, pero sigo volviendo a NaN
<div class="tip-custom" id="tip-custom"><input type="number" placeholder="CUSTOM"></div> const tipCustom = document.querySelector(".tip-custom"); tipCustom.addEventListener("input", tipInputFun); let tipValue = 0.15; function tipInputFun() { tipValue = parseFloat(tipCustom.value / 100); console.log(tipValue); }Su querySelector busca un elemento que tenga una clase tip-custom .
En su código, veo un div con id tip-custom (es decir, #tip-custom ) y su entrada está dentro del div.
Debe corregir su selector para encontrar correctamente el elemento con su texto. Podrías hacer algo como esto
document.querySelector("#tip-custom>input");Toma la primera entrada, dentro de un elemento con id tip-custom.
const tipCustom = document.querySelector("#tip-custom>input"); tipCustom.addEventListener("input", tipInputFun); let tipValue = 0.15; function tipInputFun() { tipValue = parseFloat(tipCustom.value / 100); console.log(tipValue); } <div class="tip-custom" id="tip-custom"><input type="number" placeholder="CUSTOM"></div>tipCustom es el div, no la entrada, por lo que tipCustom.value no está definido.
Mantenlo simple y sigue las buenas prácticas.
let tipValue = 0.15; function tipInput() { tipValue = parseFloat(this.value / 100); console.log(tipValue); } document.querySelector(".tip-custom > input").addEventListener("input", tipInput); <div class="tip-custom" id="tip-custom"><input type="number" placeholder="CUSTOM"></div>