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>.

&dagger; 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