why number 1 works as I need? why number 2 can't produce my desired result?

Question

Number 1:
<script>
function myFunction() {
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
</script>

Number 2:
<script>
function myFunction() {
var x = document.getElementById("myDIV");
if (x.style.display = "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}
</script>

Answer 1

If you want to compare always use == or ===.

Simple example :

var a=1
a=3 // will assign new value.

if(a==3) // will check if a is equal to 3 or not
{}

Hope this helps☺️☺️.

Answer 2

Because a single "=" is the assignment operator.
To compare values you need "=="
The tripple "===" additionally checks whether the variables are of the same data type

Answer 3

So in the 2nd method it sets the value of display to none. but in the first method it asked to check is the value of display is none? Am I right?

Answer 4

Yes, that's correct 👍

Answer 5

thanks

Answer 6

Also take care -- Id has to be unique - there can be only one of them.
you are using .getElementById and in two different cases you are referring to the same id.
getElementById will only find the first occurance of "myDIV".