frontもbackもこの制限で許容される要素しか開発させない。 ex) <... lay="xyz"></...>
;(function(root){
let fn={};
fn.q=(s,doc=document)=>{return doc.querySelector(s)};
fn.qa=(s,doc=document)=>{return [].slice.call(doc.querySelectorAll(s))}
;
function entry(q,flg){
let t='lay',qt='[lay]' //stint name
;
var o={},calc=(d=>{o[d.getAttribute(t)]=d});
o.el =(flg)?fn.q(q).cloneNode(true):fn.q(q);
if(!o.el)return console.log('lay query error');
fn.qa(qt,o.el).forEach(calc);
if(o[""]) console.log('no capture lay:',o[""]);
return o;
}
root.lay=entry;
})(this);
let a=lay('.f[ed]',true)
console.log(a)
/*
a."" //no name!
a.el
a.info
a.prog
a.ra
a.st
a.th
a.ti
*/
<!---test dom--->
<style>[debug]{display:block}</style>
<div leep>
<div l></div>
<div c> <div cc></div> </div>
<div r> <div rt></div><div></div> </div>
</div>
<div class="the-wall"></div>
<dialog debug>
<div class="f" ed>
<div lay></div>
<progress value="3" max="68" lay="prog"></progress>
<div contenteditable="plaintext-only"></div>
<div lay="info"><b lay="st">✔#001 </b><b lay="th"></b><b lay="ra"></b></b><b lay="ti"></b></div>
</div>
<!---->
<div class="f ed lay05 of-subed debug">
<progress class="of-ed" value="3" max="68"></progress>
<div contenteditable="plaintext-only"></div>
<div class="info"><div class="str">✔$001[3/4]</div><div class="time"></div></div>
</div>
<!---->
<div lay="th"></div>
</dialog>