👤 User #
1document.getElementByClass
🤖 ChatGPT #
The correct method is:
1document.getElementsByClassName()
Notice the differences:
- It’s
getElements(plural), notgetElement. - owerCamelCase :))
It returns an HTMLCollection, which is like an array of elements, not just a single element.
Example:
1// HTML
2// <div class="myClass">Hello</div>
3// <div class="myClass">World</div>
4
5// JavaScript
6let elements = document.getElementsByClassName("myClass");
7
8console.log(elements); // HTMLCollection(2) [div.myClass, div.myClass]
9console.log(elements[0].textContent); // "Hello"
10console.log(elements[1].textContent); // "World"
⚠️ Important: Since it returns multiple elements, if you want to work with just one, you need to index it like elements[0].
If you want, I can also show the modern alternative using querySelectorAll which many developers prefer. Do you want me to show that?
👤 User #
ko :(
1<title class="datetime"></title>
2<div class="datetime"></div>
3
4<script>
5(function() {
6 const key = 'savedDateTime';
7
8 // Check if datetime is already saved
9 let dt = localStorage.getItem(key);
10
11 if (!dt) {
12 const now = new Date();
13 const YYYY = now.getFullYear();
14 const MM = String(now.getMonth() + 1).padStart(2, '0');
15 const DD = String(now.getDate()).padStart(2, '0');
16 const HH = String(now.getHours()).padStart(2, '0');
17 const MIN = String(now.getMinutes()).padStart(2, '0');
18
19 dt = ${YYYY}-${MM}-${DD}..${HH}${MIN};
20 localStorage.setItem(key, dt);
21 }
22
23 document.getElementsByClassName('datetime').textContent = dt;
24})();
25</script>
🤖 ChatGPT #
Ah! I see exactly why it’s “ko” (not working). The problem is here:
1document.getElementsByClassName('datetime').textContent = dt;
getElementsByClassName does not return a single element, it returns an HTMLCollection (like an array). You can’t set textContent on the collection directly—you have to pick an element or loop through them.
Also, <title> elements don’t behave exactly like normal elements. To change the page title, you should use document.title.
Here’s a corrected version of your script:
1<title class="datetime"></title>
2<div class="datetime"></div>
3
4<script>
5(function() {
6 const key = 'savedDateTime';
7
8 // Check if datetime is already saved
9 let dt = localStorage.getItem(key);
10
11 if (!dt) {
12 const now = new Date();
13 const YYYY = now.getFullYear();
14 const MM = String(now.getMonth() + 1).padStart(2, '0');
15 const DD = String(now.getDate()).padStart(2, '0');
16 const HH = String(now.getHours()).padStart(2, '0');
17 const MIN = String(now.getMinutes()).padStart(2, '0');
18
19 dt = `${YYYY}-${MM}-${DD}..${HH}${MIN}`;
20 localStorage.setItem(key, dt);
21 }
22
23 // Set the page title
24 document.title = dt;
25
26 // Set all elements with class "datetime"
27 const elements = document.getElementsByClassName('datetime');
28 for (let i = 0; i < elements.length; i++) {
29 elements[i].textContent = dt;
30 }
31})();
32</script>
âś… Key fixes:
document.title = dt → updates <title>.
Loop through getElementsByClassName('datetime') → sets text for all <div>s with that class.
If you want, I can also rewrite it more cleanly with querySelectorAll so you don’t need the loop explicitly. It’s more modern and concise.
Do you want me to do that?
👤 User #
well: now 2 datime are shown, thanx.
my prob: msince 5im the tome does not change. ho to do timechange every minute so when broswer saves session and crashes, one tab shows time in title
🤖 ChatGPT #
Ah! Now I understand exactly what you want:
You want the saved datetime from localStorage to persist across sessions (so after a crash or reload it shows the old time). âś… But you also want the current time to keep updating every minute in the