Javascript QuerySelector在使用this.element时仅选择第二个元素

我最近开始学习JavaScript对象，以及jQuery和Modernizer等框架的工作原理

我试图创建自己的小框架，进一步了解JavaScript对象是如何工作的，以及如何充分利用它们的潜力

到目前为止，一切都很顺利，直到我尝试使用querySelectorAll方法和for循环设置一个全局变量，以使用指定的选择器获取多个元素

因此，我打算使用特定的选择器从这些元素中添加或删除一个类。然而，它只在最后一个元素上起作用

以下是我的相关JavaScript：

例如：

为什么会发生这种情况？我的for循环似乎是正确的，所以我不确定是什么错了。抱歉，如果它看起来很明显，但是，我仍然是新的香草JavaScript

感谢所有的帮助和建议， 谢谢

你有一个循环。每次循环时，它都为这个.element指定一个值

第一次循环时，它会指定els[0]的值。第二次分配els的值[1]

因为您只有两个匹配的元素，所以它到达循环的末尾并停止

此时，this.element仍然等于els[1]

---

如果您想在els中的每个项目中添加类的成员身份，则必须在修改类名时在els上循环。

我尝试过这样做，但是，它对任何东西都不起作用：/因此我恢复到原始状态。谢谢你的回答顺便说一句：你能举个例子吗？还是不工作哈哈

var aj = function(sr){
    this.selector = sr || null; // set global selector variable
    this.element = null;
}

aj.prototype.init = function(){
    switch(this.selector[0]){
        // first, second, third case e.t.c...
        default:
            var els = document.querySelectorAll(this.selector); // select all elements with specified selector (set above)
            for(var i = 0; i < els.length; i++){
                this.element = els[i];
            }
    }
};

aj.prototype.class = function(type, classes){
    if(type === "add"){ // if the user wants to add a class
        if((" " + this.element.className + " ").indexOf(" " + classes + " ") < 0){
            this.element.className += " " + classes;
        }
    } else if(type === "remove") { // if the want to remove a class
        var regex = new RegExp("(^| )" + classes + "($| )", "g");

        this.element.className = this.element.className.replace(regex, " ");
    }
};

<div class="example-class">Example</div>
<div class="example-class">Example 2</div> <!-- only this one will be altered !-->
<script>
    $(".example-class").class("add", "classname");
</script>

for(var i = 0; i < els.length; i++){
    this.element = els[i];
}