JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div id="o">
<div id="s">
</div>
</div>
</body>
JavaScript
dom = {};
/**
* Массив с регулярочками
* @type {{tag: RegExp, classes: RegExp, id: RegExp}}
*/
dom.regexps = {
'tag': /^\w+/,
'classes': /\.(\w+\.?)+/,
'id': /^#\w+/
};
dom.find = function(selector, context) {
context = context || document;
if (typeof document.querySelectorAll == 'function') {
return context.querySelectorAll(selector);
} else {
return dom.findBySelectorsList(selector, context);
}
};
/**
* Поиск по перечню селекторов
* @param selector
* @param context
* @returns {*}
*/
dom.findBySelectorsList = function(selector, context) {
var resultNodes = [];
var selectorList = selector.split(' ');
//Разобъем селекторы на массив объектов
for (var i = 0; i < selectorList.length; i++) {
var tabList = dom.parseSelector(selectorList[i]);
if (Object.keys(tabList).length) {
resultNodes.push(tabList);
}
}
//будем искать в контексте с помощью массива с объектами
for (var j = 0; j < resultNodes.length; j++) {
if (!(context instanceof Array)) {
context = dom.findBySelectors(resultNodes[j], context);
} else {
for (var ii = 0; ii < context.length; ii++) {
context[ii] = dom.findBySelectors(resultNodes[j], context[ii]);
}
}
}
return context;
};
/**
* Парсим селекторы
* @param selectors
* @returns {{}}
*/
dom.parseSelector = function(selectors) {
var selectorList = {};
for (var select in dom.regexps) {
if (dom.regexps.hasOwnProperty(select)) {
var result = selectors.match(dom.regexps[select]);
if (result) {
selectorList[select] = result[0];
}
}
}
return selectorList;
};
/**
* Поиск в контексте который точно не массив
* @param selectors
* @param context
* @returns {*}
*/
dom.findBySelectors = function(selectors, context) {
for (var select in selectors) {
if...