The goal of this exercise is to produce a consistent, canonical and symmetrical interface for reading and mutating documents. Host implemenations provide two interfaces: attribute methods and DOM properties. Both vary cross-browser and DOM properties provide only an obscured view.
The first set directly tests the implementation of get/set/removeAttribute. Cross-browser results vary. Changing compatibility modes in IE8 affects the results as well. Invoking the Compatibility View command (conveniently located on the toolbar next to Refresh) may show an improved view on the surface due to CSS quirks, but with bugs hiding beneath.
See the notes for more information about this DOM implementation.
The second set uses wrappers to achieve consistent cross-browser results.
actionURI attributes, as well as several others.
The third set attempts to reproduce the same interface with DOM properties, skipping tests that are impossible (and a few that are superfluous). Cross-browser results vary. See the notes for more information about this DOM implementation
The fourth set retrieves DOM property values by attribute name. This is the basic concept botched by the various
attr methods found in "major" libraries. It features the same utility of the attribute-based interfaces. Missing attributes return
null rather than property defaults. The style set is skipped as the style property is read only. This is the fastest and most robust solution. Like the attribute wrapper, it is 100% consistent in the latest major browsers (as well as several others tested).
There are many cross-browser differences related to attributes and properties.
Outside of the broken MSHTML implementations, inconsistencies with attributes corresponding to boolean properties require the most feature testing. The workaround to present a consistent interface for these attributes is to refer to the corresponding DOM properties, returning '' for true and
null for false. Note that this loses some precision as we cannot discriminate between these two:-
<input readonly> <input readonly="readonly">
The wrapper returns '' for both of these and
null if the attribute is missing. These attributes would be created by setting '' or the name of the attribute (e.g.
readonly). For the sake of symmetry, the former is recommended.
URI's are resolved for some attributes in older versions of major browsers (e.g. Opera). Even anchor
href attributes can be affected (e.g. Opera 8.54), in violation of the spotty DOM2 specifications.