If I am using many js files in my project and get JavaScript errors in IE 6 or 7's status bar, then how can I trace, find and solve those errors in Firefox? I know how to trace a problem in IE with visual studio but can we identify area of problem using Firefox?
I would recommend using Firebug (http://getfirebug.com/). It's a plugin for Firefox and does a great job of reporting errors to you. It also has a javascript debugger and a great DOM viewer - both of which are very helpful in fixing scripting bugs.
For Internet Explorer use the Developement Tools of Internet Explorer 8 (press F12). Internet Explorer 8 supports the Internet Explorer 7 engine.
However Firebug is easier to use and much more powerful!
Web Developer for FF [https://addons.mozilla.org/en-US/firefox/addon/60] can be helpful if you are interested in looking at warnings and other code errors that don't necessarily trigger errors - at least in FF.
Cleaning up your code using this or other tools like JSLint [http://www.jslint.com/] will make your code more manageable in the long run. But in the end, each browser's JavaScript engine just behaves differently, and errors in one specific browser will ultimately have to be debugged in its own environment.
One such error that can you scratching your head even between versions of IE is the misformed object below:
var myObj = { 1 : "val1", 2 : "val2", } alert(myObj);
In IE8 and all other major browsers the extra comma after the last entry is overlooked. IE6 and 7 will throw an error. But the Web Developer plugin for FF shows the following warning:
Warning: trailing comma is not legal in ECMA-262 object initializers Source File: http://localhost/test.html Line: 10 Source Code: }