void(),
вынос цикла в отдельный метод ... может кто-то предложит свой вариант ...
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.hot.class-active{
background-color: #3366FF;
}
.red {
background-color: #FF0000;
}
.hot{
border: 1px dashed Gray; padding: 5px; height: 100px; width: 100px;
}
</style>
</head>
<body> <style type="text/css">
</style>
<div class="hot">test</div>
<div class="hot red">test</div>
<div class="hot">test</div>
<script>
"use strict"
function $(selector){ return new Q(document.querySelectorAll(selector)); }
class Q {
constructor(selector){ this.selector = selector; }
toggleClass(newSelect,event) {
var fn = function() {
this.classList.toggle(newSelect)
};
return this.forEach(fn, event)
};
forEach(fn, event) {
[].forEach.call(this.selector, function(item) {
event ? item.addEventListener(event, fn.bind(item)) : fn.bind(item)()
});
return this
};
css(data, event) {
var fn = function() {
var item = this;
Object.keys(data).forEach(function(key) {
item.style[key] = data[key]
})
};
return this.forEach(fn, event)
};
}
$('.hot').toggleClass('red').css({"color" : "#66FF00", width : "200px"}).toggleClass('class-active','click');
</script>
</body>
</html>