dom-regex
Version:
JavaScript library for querying DOM elements with Regular Expressions
113 lines (83 loc) • 2.49 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div data-id="12345>"><p data-tagname="p">Testing</p></div>
<div data-id="54321"></div>
<div data-id="chars"></div>
<custom-element id="pretty-special"></custom-element>
<custom-element id="super-special"></custom-element>
<custom-element id="not"></custom-element>
<p></p>
<h1></h1>
<svg></svg>
<div id="awesomeID" class="one two three four" data-text="<div>Testing</div>" data-id="3">Content</div>
<select id="normal-select">
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
</select>
<div id="parent-with-children">
<div>
<select data-event="change-normal">
<option></option>
<option></option>
<option></option>
<option></option>
<option></option>
</select>
</div>
</div>
<script src="lib/dom-regex.js"></script>
<script>
var query1 = DomRegex.all(/data-[a-z]+="\d/);
console.log(query1);
var query2 = DomRegex.all(/nt/, 'id');
console.log(query2);
var query3 = DomRegex.all(/awe/, 'id');
console.log(query3);
var query4 = DomRegex.all.inside('#parent-with-children', /sele/);
console.log(query4);
var query5 = DomRegex.all.inside('select',
/optio/
);
console.log(query5);
var query6 = DomRegex.all.inside(document.querySelector('select'),
/optio/
);
console.log(query6);
console.log('\n\nNOW ONLY ONE\n\n');
var query7 = DomRegex.one(/data-[a-z]+="\d/);
console.log(query7);
var query8 = DomRegex.one(/nt/, 'id');
console.log(query8);
var query9 = DomRegex.one(/awe/, 'id');
console.log(query9);
var query10 = DomRegex.one.inside('#parent-with-children', /sele/);
console.log(query10);
var query11 = DomRegex.one.inside('select',
/optio/
);
console.log(query11);
var query12 = DomRegex.one.inside(document.querySelector('select'),
/optio/
);
console.log(query12);
var query20 = DomRegex.all.against([].slice.call(document.querySelectorAll('select')), /normal/, 'id');
console.log(query20);
var query21 = DomRegex.one.against([].slice.call(document.querySelectorAll('select')), /-normal/);
console.log(query21);
var query22 = DomRegex.all.against(document.querySelector('#awesomeID'), /div/, 'data-text');
console.log(query22);
let fragment = document.createDocumentFragment();
fragment.appendChild(document.createElement('p'));
var queryfragment = DomRegex.one.inside(fragment, /^p/);
console.log(queryfragment);
</script>
</body>
</html>