When Do I Need Quotes For Document.getelementbyid?

I have a simple script which converts a text input of inches into another text input of centimeters. However, when I pass it to my function, I noticed that I have to use quotes for

Solution 1:

Because without the quotes you are looking for a variable newheight that is defined in the global scope. Some browsers do a bad thing and says if I do not have a variable with this id, I look for an DOM element that has that id.

So what you are passing in is an DOM Element with that id and not a string. That is why IDin.value works.

A better way of doing that is to pass in the scope of the element that was changed.

<inputtype="text"id="newheight" onchange="inchestocm(this,'newheightcm')">

That way you are not dealing with the browser quirk that made the code run in the first place.

Solution 2:

function inchestocm(IDin, IDcm) { var inches = IDin.value; var centimeters = inches*2.54; document.getElementById(IDcm).value = centimeters; }

newheight is the DOM element <input type="text" id="newheight" onchange="inchestocm(newheight,'newheightcm')"> as there is no variable defined in your code with that name, check epascarello's answer

You can checnge your code as

<script>functioninchestocm(IDin, IDcm) { 
    IDin = document.getElementById(IDin);
    var inches = IDin.value;
    var centimeters = inches*2.54;  
    document.getElementById(IDcm).value = centimeters;  
}
</script><inputtype="text"id="newheight"onchange="inchestocm('newheight','newheightcm')"><inputtype="text"id="newheightcm">

Solution 3:

<inputtype="text"id="newheight" onchange="inchestocm(newheight,'newheightcm')">

In your code, both arguments are different, first one is an object from where u r trying to get the value and second one is string where u want to paste the result. Not sure but try this ones.

<script>functioninchestocm(IDin, IDcm) {   
var inches = IDin.value;
var centimeters = inches*2.54;  
IDcm.value = centimeters;  
}
</script><inputtype="text"id="newheight"onchange="inchestocm(newheight,document.getElementById('newheightcm'))"><inputtype="text"id="newheightcm">

Solution 4:

you are using the parameters of the function that's why you can't use double quotes.If you use the direct name of the id then double quotes would be used.