当我对该对象进行克隆时,会显示一条错误消息(When I make a clone of the object shows me an error message)

首先,以下是我自己的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时,问题就开始出现了TypeError: $(...).html is not a function 。

现在我想使用像那样的元素选择器

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

代替

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

First the following is the code of my own javascript library.

(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; })();

Previously, I have used this way to use my own library, and works fine .

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

But when updated the code of my own library, and I added

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

To be using the element selector like this way

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

But the problem began appear when added the updated code to clone the lib object TypeError: $(...).html is not a function.

And now I want to use the element selector like that

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

instead of

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

最满意答案

你创建了一个变量fn,它引用了“getElem”,但由于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”维护为上下文。

You create a variable fn which has a reference to "getElem" but since fn is not a property on your lib object then it means that when getElem refers to "this" it will be you global object which is propbably window.

Remove all the following 3 lines

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

and then do this

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

This will allow getElem to be called as $ but maintaining "lib" as context.

当我对该对象进行克隆时,会显示一条错误消息(When I make a clone of the object shows me an error message)

首先,以下是我自己的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时,问题就开始出现了TypeError: $(...).html is not a function 。

现在我想使用像那样的元素选择器

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

代替

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

First the following is the code of my own javascript library.

(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; })();

Previously, I have used this way to use my own library, and works fine .

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

But when updated the code of my own library, and I added

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

To be using the element selector like this way

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

But the problem began appear when added the updated code to clone the lib object TypeError: $(...).html is not a function.

And now I want to use the element selector like that

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

instead of

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

最满意答案

你创建了一个变量fn,它引用了“getElem”,但由于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”维护为上下文。

You create a variable fn which has a reference to "getElem" but since fn is not a property on your lib object then it means that when getElem refers to "this" it will be you global object which is propbably window.

Remove all the following 3 lines

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

and then do this

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

This will allow getElem to be called as $ but maintaining "lib" as context.