0

まず、以下は私自身の JavaScript ライブラリのコードです。

(function() {
    var lib = {
        elems: [],
        getElem: function() {
            var tmpElem = [];
            for (var i = 0; i < arguments.length; i++)
                tmpElem.push(document.getElementById(arguments[i]));
            this.elems = tmpElem;
            tmpElem = null;
            return this;
        },
        html: function(txt) {
            for (var i = 0; i < this.elems.length; i++)
                this.elems[i].innerHTML = txt;
            return this;
        },
        style: function(prob, val) {
            for (var i = 0; i < this.elems.length; i++)
                this.elems[i].style[prob] = val;
            return this;
        },
        addEvent: function(event, callback) {
            if (this.elems[0].addEventListener) {
                for (var i = 0; i < this.elems.length; i++)
                    this.elems[i].addEventListener(event, callback, false);
            } else if (this.elems[0].attachEvent) {
                for (var i = 0; i < this.elems.length; i++)
                    this.elems[i].attachEvent('on' + event, callback);
            }
            return this;
        },
        toggle: function() {
            for (var i = 0; i < this.elems.length; i++)
                this.elems[i].style.display = (this.elems[i].style.display === 'none' || '') ? 'block' : 'none';
            return this;
        },
        domLoad: function(callback) {
            var isLoaded = false;
            var checkLoaded = setInterval(function() {
                if (document.body && document.getElementById)
                    isLoaded = true;
            }, 10);
            var Loaded = setInterval(function() {
                if (isLoaded) {
                    clearInterval(checkLoaded);
                    clearInterval(Loaded);
                    callback();
                }
            }, 10);
        }
    };

    var fn = lib.getElem;
    for(var i in lib)
        fn[i] = lib[i];

    window.lib = window.$ = fn;
})();

以前は、この方法で自分のライブラリを使用していましたが、問題なく動作しました。

$.getElem('box').html('Welcome to my computer.');

しかし、自分のライブラリのコードを更新し、追加したとき

var fn = lib.getElem;
for(var i in lib)
   fn[i] = lib[i];

このように要素セレクターを使用するには

$('box').html('Welcome to my computer.');

しかし、lib オブジェクトのクローンを作成するために更新されたコードを追加すると、問題が発生し始めましたTypeError: $(...).html is not a function。

そして今、私はそのような要素セレクターを使いたいです

$('box').html('Welcome to my computer.');

それ以外の

$.getElem('box').html('Welcome to my computer.');
4

3 に答える 3

0

「getElem」への参照を持つ変数 fn を作成しますが、fn は lib オブジェクトのプロパティではないため、getElem が「this」を参照すると、おそらくウィンドウであるグローバル オブジェクトになることを意味します。

次の 3 行をすべて削除します。

var fn = lib.getElem;
for(var i in lib)
   fn[i] = lib[i];

そして、これを行います

window.$ = function () { return lib.getElem.apply(lib, arguments); };

これにより、getElem を $ として呼び出すことができますが、"lib" はコンテキストとして維持されます。

于 2013-04-23T11:13:54.800 に答える
0

これを達成する方法は他にもありますが、根本的な原因はgetElem()関数にあります。return this;

$その関数への参照です。呼び出す$()場合は、メソッドとしてではなく関数として呼び出されます。したがって、thisもちろん何の機能もありません。windowwindowhtml()

return lib;問題を解決するために行うことができます。

于 2013-04-23T11:22:22.853 に答える