className returns undefined in Javascript [duplicate] - javascript

This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 5 years ago.
There are a lot of similar questions and answers, but after trying all solutions I can't figure out what's wrong with my code.
Here is my code
var x = document.getElementsByClassName('xclass1 xclass2 xclass3');
console.log(x);
x.className += ' class4';
console.log(x);
console.log(x.className);
Here is what shows up in the first console.log:
[a.xclass1.xclass2.xclass3]
It shows that it finds the right element
Here is what shows up in the second console.log:
[a.xclass1.xclass2.xclass3, className: "undefined class4"]
And the third one returns this:
undefined class4
Can anyone please explain why className returns undefined? I am completely lost here

See below code snippet
return undefined because you trying to console class for array of object which include element not actual element.
var x = document.getElementsByClassName('xclass1 xclass2 xclass3');
console.log(x);
x[0].className += ' class4';
console.log(x);
console.log(x[0].className);
<div class="xclass1 xclass2 xclass3"></div>

Related

Uncaught TypeError: Cannot read properties of null (reading 'addEventListener') [duplicate]

This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 2 months ago.
document.querySelector('.number');
document.querySelector('.check').addEventListener('click', function () {
const guess = Number(document.querySelector('.guess').value);
console.log(guess, typeof guess);
if (!guess) {
document.querySelector('.message').textContent = 'No Number!';
}
});
I don't know what's wrong with the addEventListener, Can anyone please help me?Thank you
Looks like you are trying to access an element that is null. The dot operator throws an error when it's trying to access null.addeventlistener(...)
I am not sure if there is anything wrong with your HTML as its not been shared here. But my guess is it has to do with the HTML classes.
For debugging purposes print your document.querySelector('.check') and see what it consoles and based on that take it from there.

Why in JS a.test = 1 when "a" is a number doesn't throw an error [duplicate]

This question already has answers here:
How is almost everything in Javascript an object?
(6 answers)
Closed 5 months ago.
I tested this today and I don't understand the behaviour. For me, that should be an error.
const a = 1;
a.test = 1;
console.log(a)
console.log(a.test)
Someone have the answer ?
you can define properties pretty much anything, but in this case you are assigning it to a number which doesn't actually hold properties.

Why does a function stored in an Object return undefined in console at the end of running? [duplicate]

This question already has answers here:
Why does console.log say undefined, and then the correct value? [duplicate]
(5 answers)
Closed 7 years ago.
Was playing around with creating 'class objects'? if that is the correct term.
var cat = {
eyes:2,
pur: function() {
console.log("puuuuurrrrr");
}
};
cat.pur();
In Chrome this returns the console.log message and then on the next line undefined. Was wondering whats causing the undefined to pop up at the end. It doesn't do it when i call cat.eyes. In internet explorer this happens before the console.log() event.In nodeJS this happens after console.log.
you see first in the console what you wrote to the console which is puuuuurrrrr
the undefined is the output of pur() which is nothing meaning undefined.
if you would change pur to
console.log('whatever....');
return 'something';
than you will see instead of 'undefined' the value 'something'.
hope that explains it.

Undefined yet defined variable? [duplicate]

This question already has answers here:
Why does JavaScript variable declaration at console results in "undefined" being printed?
(4 answers)
Closed 8 years ago.
Here I define a variable:
var number = Math.round(Math.random() * 10);
When I plug it into the Chrome DevTools JavaScript Console, I get a very weird error: undefined. I have never seen this error before, and I don't see how the variable is undefined.
Is there something I'm doing wrong?
(I'm sure this is one of those in-plain-sight issues.)
That's right. This expression returns undefined - because var doesn't return anything.
But if you type number and press enter you will get the result.

Cannot use style method in JS [duplicate]

This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 9 years ago.
In this code:
<header class="alg">Some text</header>
<script>
var header = document.getElementsByClassName("alg");
header.style.color = 'red';
</script>
after run it. I got from log:
TypeError: header_m.style is undefined
What do I do wrong?
getElementsByClassName returns multiple elements.
Therefore, you are accessing it improperly. What you want, in this case, is:
header[0].style.color = 'red';
// ^ [0] will get the first element with the class,
// which is in this case your is header element. [1] would get the second, etc.
jsFiddle.

Categories

Resources