HTML-BASED CUSTOM ENTITY REFERENCES are unfortunately not supported in text/html (and XML support is spotty), despite their convenience in authoring, especially for non-technical authors or those who wish to share and utilize documents stored on the local file system without a server to execute substitutions.
All of the following client-side approaches are possible, though they may be technically discouraged for universal access since some people might not enable JavaScript or CSS (and XML support is currently inconsistent as far as entities, particularly with regard to external entities).
The example files detail the usage, but to summarize, the following means of defining entities are possible:
- Via XML entities
- Advantages:
- Does not require script file
- Behavior defined in a standard
- Easy to write definitions and references
- Allows for nested entities
- Disadvantages:
- Browser support varies with single-point-of-failure for externally defined entities not found in the internal subset and no fallbacks despite the XML specification's recommendations.
- Requires less-used XML syntax and application/xhtml+xml or application/xml content-type
- Advantages:
- Via XML (namespaced) elements harvested for definitions by
XSL or XSL variables
- Advantages:
- Pretty good browser support
- Not difficult to write definitions and references
- Allows for nested entities?
- Disadvantages:
- Not the official way to define replacement text (but will work)
- Requires less-used XML syntax and application/xhtml+xml or application/xml content-type
- Requires additional download of XSL template to perform replacements
- Disadvantages:
- Advantages:
- Via use of the CSS content property
- Advantages:
- Does not require script file
- Allows external file usage
- Disadvantages:
- Browser support varies
- Somewhat cumbersome to write
- Does not allow numeric definitions as allowed by the JavaScript code (though the latter are really redundant anyways since HTML supports numeric character references)).
- Does not allow arbitrary HTML substitution--only text
- Requires CSS to be enabled
- Does not support nested definitions
- Advantages:
- Via JavaScript (with optional HTML definitions):
- Approaches:
- Via definition of properties on a "JSEntityMap" global JavaScript object defined before the entities.js file is included
- Via HTML meta elements with name set to "entity" and "content" attribute set to "{entity name}={entity name}"; script also allows retrieval of meta elements defined in an iframe in the body of the document so that this approach will also allow external file definitions; note that this meta extension has been proposed at http://wiki.whatwg.org/wiki/MetaExtensions thereby making them "legal HTML5 meta names" per the wiki.
- (One could also simply define entities such as
var copy = '\u00a9';
and then execute that, but that has the disadvantage of adding globals.)
- Advantages:
- Should work well in all well-used browsers
- Easy to write definitions and references
- Allows external file usage
- Disadvantages:
- Requires JavaScript enabled by user (though at least fallbacks can be used if desired)
- Requires inclusion and execution of external JavaScript file, waiting for content-load (and iframe load, if iframe definitions are used).
- Library does not currently support nested definitions or arbitrary HTML (though easy to add)
- Approaches:
The following means exist for creating entity references using the above approaches:
- Via XML entities:
- Entity references
- Via XML elements
- Can use elements with or without content and let XSL handle substitutions as desired; preferable to use namespace
- Via use of the CSS content property
- Empty HTML elements
- Custom elements for simple and descriptive but non-standard references (e.g., or <entity ent=>)--also requires special JavaScript handling in older IE browsers
- HTML4 tags (e.g., div or span)
- HTML5-standard "data" tag with "data-ent" attribute
- Empty HTML elements
- Via HTML (in conjunction with JavaScript library and definitions):
- Empty HTML elements (or elements with fallback content for
page load)
- Custom elements for simple and descriptive but non-standard references (e.g., or <entity ent=>)
- HTML4 tags (e.g., div or span) with "data-ent" attribute
- HTML5-standard "data" tag with "data-ent" attribute
- Script tags (<script>e('{entity name}')</script>)
- Empty HTML elements (or elements with fallback content for
page load)
Tested in IE10 with document mode set to IE7-IE10. Tested in Firefox 23.0