Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I am in a similar situation, working on a web app that is targeted at IT professionals, and required to support the same set of browsers, minus Opera.</p> <p>Some general things I've learned so far:</p> <ul> <li>Test often, in as many of your target browsers as you can. Make sure you have time for this in your development schedule.</li> <li>Toolkits can get you part of the way to cross-browser support, but will eventually miss something on some browser. Plan some time for debugging and researching fixes for specific browsers.</li> <li>If you need something that's not in a toolkit and can't find a free code snippet, invest some time to write utility functions that encapsulate the browser-dependent behavior.</li> <li>Educate yourself about known browser bugs, so that you can steer your implementation around them.</li> </ul> <p>A few more-specific things I've learned:</p> <ul> <li>Use conditional code based on the user-agent only as a last resort, because different generations of the "same" browser may have different features. Instead, test for standards-compliant behavior first &mdash; e.g., <code>if(node.addEventListener)...</code>, then common non-standard functions &mdash; e.g., <code>if(window.attachEvent)...</code>, and then, if you must, look at the user-agent for a specific browser type &amp; version number.</li> <li>Knowing when the DOM is 'ready' for script access is different in just about every browser. A good toolkit will abstract this for you.</li> <li>Event handlers are different in just about every browser. A good toolkit will abstract this for you.</li> <li>Creating DOM elements, particularly form controls or elements with attributes, can be tricky with document.createElement and element.setAttribute. While not standard (and kinda yucky), using node.innerHTML with strings that contain bits of HTML seems to be more reliable across browser types. I have yet to find a toolkit that will let you use element.setAttribute to add a 'name' to a form element in IE.</li> <li>CSS differences (and bugs) are just as important as JS differences.</li> <li>The 'core' Javascript features (String, Date, RegExp, Array functions) seem to be pretty reliable and consistent across browsers, especially relative to the DOM/CSS/Window functions. There's some small joy in the fact that the language isn't entirely different on every platform. :-)</li> </ul> <p>I haven't really run into any Chrome-specific JS bugs, but it's always one of the first browsers I test.</p> <p>HTH</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload