live * On Wed, May 22, 2019 at 7:25 PM Andrea Giammarchi < andrea.giammar...@gmail.com> wrote:
> With Custom Elements you have `attributeChangedCallback` which reacts > after `observedAttributes` returned attributes, and I believe you'd like to > use that to create getters and setters out of the box. > > I don't think DOM specific class fields/syntax will ever land in JS > itself, but I can suggest you looking at most handy custom elements > patterns in here: > https://gist.github.com/WebReflection/ec9f6687842aa385477c4afca625bbf4 > > About being unique, you can always `document.querySelector('[attribute="' > + value +'"]')` and, if not null, throw an error 'cause already live on the > DOM. > > However, IDs are the most "unique" thing you can have, even if 2 IDs with > same content are still allowed love on the document. > > If you look for an easy way to have unique IDs, remember you can start > from `let id = Math.random()` and do `++id` any other time to have a new, > rarely clashing, unique name. Prefix it with the `nodeName` and see you've > already all uniqueness you need for you custom elements, since you can't > define two custom elements with the same name anyway (yet, unless scoped, > but that's another story). > > Regards > > On Wed, May 22, 2019 at 7:07 PM Randy Buchholz <w...@randybuchholz.com> > wrote: > >> I’ve been working with `Custom Elements` and I’m writing a lot of code >> against tag attributes. In some cases, I want the attribute values to be >> unique on a page (like `id`). It got me wondering about how the engines >> handle attribute based searches, and if indexing (with unique/distinct >> options) would provide value. I also find myself writing a lot of >> boilerplate getters/setters for attributes in the elements. Attribute >> handling could be improved by adding some additional support with something >> like an `attrib` feature. This would be similar to `get` or `set` in use. >> >> >> >> ``` >> >> class MyElement extends HTMLElement{ >> >> attrib myAttrib(‘my-attribute’) index distinct; >> >> } >> >> ``` >> >> This would create the attribute `my-attribute` on the tag and element, >> and also generate a getter and setter >> >> ``` >> >> get myAttrib() { return this.getAttribute(‘my-attribute’); } >> >> set myAttrib(v) { this.setAttribute(‘my-attribute’, v); } >> >> ``` >> >> The `index` flag it would tell the engine it should create a map/hash to >> improve search optimization for heavily searched attributes. >> >> The `distinct` flag would indicate that all values for that attribute >> within context (e.g., document) should be unique. This might be used >> primarily by IDE’s to generate warnings. >> _______________________________________________ >> es-discuss mailing list >> es-discuss@mozilla.org >> https://mail.mozilla.org/listinfo/es-discuss >> >
_______________________________________________ es-discuss mailing list es-discuss@mozilla.org https://mail.mozilla.org/listinfo/es-discuss
