其他运算符 | JS | 镀铬扩展

Question

I have this function:

function FizzBuzz(){
   if(document.getElementById("textbox") == true){
      Fizz();
   } else {
      Buzz();
   }
}

The Fizz() and Buzz() functions place text in textboxes specified by document.getElementById in their own functions.

in it's current configuration, it should to my understanding execute Fizz() if ("textbox") is found on the webpage, otherwise Buzz() should be executed. This does not happen, and it will only execute one of them, no matter if ("textbox") is true or not.

The ("textbox") referenced above only exists on one of the two pages this is designed to work with.

Changing to !== true will invert the effect, the same with == false , as with the current behavior is expected. I have also tried to check for == null and !== null , this results in the same behavior.

I simply do not understand what I'm doing wrong here.

Answer 1

document.getElementById returns either null or element. So, comapring both with == or === with true or false will always return false. You can directly put document.createElement inside if as a condition. If you still face the issue, I suggest you to put a break point and see how the code is executed.

Sample code for better understanding - https://codepen.io/Yash__/pen/WNzgYvL?editors=1111

<h1 id="hai">hai</h1>

if(document.getElementById('hai')){
  console.log("there");
}else{
  console.log("not there")
}