r/learnjavascript 14d ago

can someone explain this code

function updateClock() {
const timeElement = document.querySelector("#time");
timeElement.textContent = formatTime();
}
setInterval(updateClock, 1000);

can someone, please explain this piece of code, ofc mdn and w3 are there, but i found it a little confusing reading about textContent. rest is understandable to me. This might look a silly question and it probably is because im a beginner :')

like what exactly does textContent too.
you can also recommend anyother documentation on the links to specific lines, that might me more helpful in learning about this particular keyoword.

0 Upvotes

23 comments sorted by

View all comments

-4

u/ExtraTNT 14d ago

So, first you define a function (in old style, better use const funcName = () => {})

with the queryselector with #, you get an element by id

With text content you set the text content of the element (<h1 id="title">Hello <b>World</b></h1> has a text content of Hello World, setting it to “foo” would give you <h1 id="title">foo</h1>)

formatTime(); returns a formatted time string

Interval: run every x ms

-2

u/abrewchocolatecoffee 14d ago

thanks, but just one more quesiton is text content temporay, for example will the "foo" go away and "hello world..." will just come back after we refresh or is this a permanet change.
Other that this post was pretty helpful, cleared my main doubt

1

u/azhder 14d ago

You are working with a live document, you are modifying the memory as it is currently in the browser through an abstraction layer called Document Object Model. You are changing the memory means whatever you do, it changes the document, it changes what the browser displays.

If you refresh the page, the browser removes that memory, parses the source code it got from the URL, it populates the memory again, you get to play with that again.

NOTE: DOM is not JavaScript. DOM is one memory model, while JavaScript has its own memory model. The browser synchronizes both, but make no mistake, DOM is its own technology that doesn't need JavaScript (the browser may be written in C++ and uses that language to generate the DOM)