Why this DOM doesn´t work?

Hello there, so i was just tired of doing JS in the dev console of google Chrome and just 10 minutes ago I opened up my VIsual Studio Code and start writing code to get set up an “environment” to try code. However, my DOM skills never were too good (thats why once I discovered jQuery i swear myself to never touch an “addEventListener” again in my life).

Not surprisingly, my code doesn´t work:

const h1 = document.getElementById('root');

const resultadoFUncion = (nombre)=> {
    return nombre
}
resultadoFUncion(Javier)

h1.textContent = resultadoFUncion

Can someone tell me where is the mistake? If I put (resultadoFUncion) withouth calling the argument ‘Javier’ there is indeed something printed on the html BUT (and this where my frustration arises) it says (nombre)=> { return nombre } the same thing that happens to me always that i try to asign functions to variables in the dev console in chrome. It seems after so many challenges i can´t grasp this simple thing, man. ITs so frustrating

resultadoFUncion(Javier)

h1.textContent = resultadoFUncion

You are calling your function here but not saving its return value to any variable. Then you’re setting the text of your h1 to the function (not what you want to do). You want to call the function, and set its return value to your h1, like so:

h1.textContent = resultadoFUncion('Javier');

Hey there – you’re close, but there are a couple things missing.

Your function resultadoFUncion is returning a name that’s being passed into it. However, that text value needs to be stored somewhere. In the case of your code, it appears that you want to store it in h1.textContent. However, you’re not invoking the function (think executing the function, which requires ()) where you’re trying to set the value of h1.textContent.

When using something like const resultadoFUncion, keep in mind that if you run the function after that, you’re not changing the value of the resultadoFUncion. That said, maybe try something like:

const h1 = document.getElementById('root');

const resultadoFUncion = (nombre)=> {
    return nombre
};

h1.textContent = resultadoFUncion('Javier');

That will still not work if you don’t have an HTML element with and id="root" – keep that in mind. Hope this helps!

1 Like

Ohhh Ok right. I think i got it and know now why it doesn´t work.
Thanks!

1 Like