Given a DOM node, return a unique CSS selector matching only that element
MIT License
Given a DOM node, return a unique CSS selector matching only that element. This is particularly useful when tracking in custom variables in analytics:
document.addEventListener('click', function(event) {
var selector = unique(event.target);
_gaq.push(['_trackEvent', 'Engagement', 'Click', selector]);
}, false);
e.g.1 DomElement = <span id="test"></span>
import unique from 'unique-selector';
// Optional Options
options = {
// Array of selector types based on which the unique selector will generate
selectorTypes : [ 'ID', 'Class', 'Tag', 'NthChild' ]
}
unique( DomElement, options ); // #test
e.g.2 DomElement = <span test="2"></span>
import unique from 'unique-selector';
// Optional Options
options = {
// Array of selector types based on which the unique selector will be generate
selectorTypes : [ 'Attributes' ]
}
unique( DomElement, options ); // [test="2"]
e.g.3 DomElement = <div id="xyz" class="abc test"></div>
import unique from 'unique-selector';
// Optional Options
options = {
// Regular expression of ID and class names to ignore
excludeRegex : RegExp( 'xyz|abc' )
}
unique( DomElement, options ); // .test
$ npm run test
Feel free to open issues, make suggestions or send PRs. This project adheres to the Contributor Covenant code of conduct. By participating, you are expected to uphold this code.
Avraam Mavridis : @avraamakis
Eric Clemmons : @ericclemmons
v0.1.0
v0.0.4
className
(#9)v0.0.3
<form>
elements (#2)v0.0.2
nth-child
calculationv0.0.1
MIT