More than 5 years have passed since last update.

jQuery : a self Implemetation

Last updated at 2019-05-30Posted at 2019-05-30

jquery.html

<html>
<header>
<script>
var $ = function(selector, context) {
    return new $.fn.init(selector, context);
};

$.fn = $.prototype;

$.fn.init = function(selector, context) {
    var nodeList = (context || document).querySelectorAll(selector);
    this.length = nodeList.length;
    for (var i = 0; i <
        this.length; i += 1) {
        this[i] = nodeList[i];
    }
    return this;
};

$.fn.init.prototype = $.fn;

$.fn.each = function(fn) {
    var i = 0,
        length = this.length;
    for (; i <
        length; i += 1) {
        fn.call(this[i], i, this[i]);
    }
    return this;
};

$.fn.hide = function() {
    this.each(function() {
        this.style.display = "none";
    });
};

$.fn.show = function() {
    this.each(function() {
        this.style.display = "block";
    });

};

$.fn.toogle = function() {
    that = this;
    var cnt = 0;

    function run() {
        if (cnt > 10) {
            clearInterval(myInterval);
            return;
        }
        cnt++;

        that.each(function() {

            if (this.style.display == "block") {
                this.style.display = "none";
            } else {
                this.style.display = "block";
                this.value = cnt;
            }

        });
    }
    myInterval = setInterval(run, 1000);
};

window.onload = function() {
    $("input").toogle();
}
</script>
</header>
<body>
<input id="111" />
<input id="222" />
</body>
</html>

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up