Is it possible to have different javascript codes for each browsers?_问答_开发者

I found a code from the past post here which goes like:

<!--[if IE]>
<script type="text/javascript" src="js/ie.js"></script>
<![endif]-->
<!--[if !IE]>-->
<scri开发者_如何学运维pt type="text/javascript" src="js/all.js"></script>
<!--<![endif]-->

Is there a way to make it like there's a separate .js file for safari and another one for mozilla? Thanks for helping

Yes. You can programmaticaly check what browser the user has, and then add a script tag to the head.

For example,

 if (navigator.userAgent.indexOf("Firefox") != -1) {
   var head = document.getElementsByTagName('head')[0];
   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = 'firefoxScript.js';
   head.appendChild(script);
}

This is, however, generally a bad idea. You should not change your behavior based on the browser, because if the browser changes it can make you code very hard to maintain. It is better to use feature detection. Modernizr is a good framework for this.

Alternatively, just use a framework that already fixes most of the browser compatability problems for you, like jQuery.

If you can't use a javascript library, such as jQuery, MooTools, Dojo et all, you should, instead of sniffing the user agent (browser), detect only it's capabilities, or else you will end up with JS files for IE6, IE7, IE8 as they all have different capabilities.

For more info look into http://www.quirksmode.org/js/support.html and http://www.modernizr.com/

As a disclaimer, this is a terrible idea, but here goes. You can do the following in jQuery, this assumes you are using jQuery, although if you are then you wouldn't need this but whatever

if ($.broswer.msie) $.getScript('js/ie.js')
else if ($.broswer.mozilla) $.getScript('js/firefox.js')
else if ($.broswer.opera) $.getScript('js/opera.js')
else if ($.broswer.webkit) $.getScript('js/chrome.js')

It is generally considered to be a much better strategy to use "feature detection" rather than "browser detection" and have code that adjusts it's technique based on whether an individual feature does or doesn't exist.

This system is much more scalable over time as browsers evolve, fix bugs, add features, etc.. because it automatically adjusts based on whether a given feature or behavior is or isn't there rather than trying to keep up with all versions of all browsers.

For example, in today's most recent browser versions, pretty much everything except IE9 supports CSS3 transitions. But older versions of lots of browsers don't support them and someday some future version of IE will support them.

If you use feature detection to see if CSS3 exists and use it if it does and use a fallback mechanism if it doesn't, then you don't have to keep track of any of these versions. You detect if the feature is there or not. It's that simple. When a future version of IE supports CSS3 transitions, you won't have to update your code to take advantage - it will do so automatically. When someone shows up on your site with a browser you haven't specifically coded for, your feature detection will probably still work even though you've never coded for that browser.

I think we don't need to do this anymore given that modern Javascript frameworks take care of cross-browser compatibility for use. It's better to use a jQuery or anything similar than to re-invent the wheel...

these should help: http://www.quirksmode.org/js/detect.html http://www.javascriptkit.com/javatutors/navigator.shtml

or use jQuery ;)

As said in the other answer its better to use a framework to abstact over the browser differences. In modern web design you should never test for feature support by user agent but using a libary such as modenizer (found here). This will give you global variables as to if certain features exist

These are IE Conditional Comments, and they only work on Internet Explorer. Although they're handy for providing fallbacks for this historically buggy and feature-lacking browser, this isn't really considered the best way to provide cross-browser support.

Instead, you should use feature detection to figure out what's missing from each browser and either load alternative scripts or disable extra features.

Check out Modernizr, it has automatic tests for just about every new feature and lets you use the results in both Javascript and CSS.