vue-setattribute-extended
v0.0.9
Published
setAttribute extended names
Downloads
1
Readme
vue setattribute-extended
Enable special characters in DOM attribute names.
ele.setAttribute( '@example', 'foo')
(Extension designed to work with any JS framework.)
Explanation
HTML5's syntax permits certain extended characters (unicode) in tags and attribute names; but JavaScript's (DOM level 3) setAttribute does not. If you need JavaScript to create attributes with punctuation and cool unicode characters, use this module.
setattribute-extended is a monkey patch that allows the JavaScript setAttribute† function to correctly create "extended" attribute names. (e.g. &click) Without it, extended characters cannot be set in attribute names. Plain attribute names (by default) are limited to
RegExp ``` /^[-]?[a-z$.][a-z0-9$:.-]+$/i
There is a cost. Extended names
are slower to set than plain names...
(the code uses three DOM level 1 methods). Therefore, the slower, extended algorithm is
applied only to names with special characters</u>.
† The original function is still available as ```_setAttribute( )```
## Usage
Install using npm modules:
npm install --save vue-setattribute-extended
Method 1. Copy source file and load with script tag. (e.g. from index.html)
Method 2. Import in App.vue
import 'vue-setattribute-extended'
Thereafter, global (ie window) **setAttribute** accepts extended attribute names up to the instant the next page is loaded.
Compatible with any JavaScript Framework.
## test
cd vue-set-attribute npm install npm run test
// opens index.html in browser setAttributeExtended passes 6 tests OK or OOPS