Say if you are using the following JavaScript function to alert user if a TextBox is empty:
<script language="JavaScript" type="text/javascript"> function validateInput() { if (document.getElementById('<%=TextBox1.ClientID%>').value="") { alert("The text box is empty!"); } } </script>
If the above code is embedded in the aspx page, it works as expected. But if you put the above function in a .js file and include it in your aspx file, you will get a “Object expected” error in IE, or “document.getElementById(‘<%=TextBox1.ClientID%>’) is null” error in FireFox. What is the problem?
The reason is if the code is embedded in aspx page, when ASP.NET renders the aspx page, it will execute <%=TextBox1.ClientID%> to get the actural ID of the TextBox. If you view the page source after the page is loaded, you will find document.getElementById(‘<%=TextBox1.ClientID%>’) becomes document.getElementById(‘TextBox1’), so it runs fine. However, if the code is included in a .js file, ASP.NET will not execute <%=TextBox1.ClientID%>, so the JavaScript will literally try to find an element with ID=<%=TextBox1.ClientID%> , of course it can’t find it, then it gives the above error. You will need to change document.getElementById(‘<%=TextBox1.ClientID%>’) in the .js file to document.getElementById(‘TextBox1’), to make it work .
So the bottom line: if you want to use .js file in aspx page, make sure you don’t have any server-side code in it, because ASP.NET will not execute them.