$函数
绑定事件
-
click
方法
显示隐藏——show
、hide
方法 -
hover
方法- 解决函数中的
this
问题 -
call
、apply
- 解决函数中的
toggle方法
<p>鼠标移动到该段落。</p>
<button>切换 hide() 和 show()</button>
<input type="button" value="1">
<input type="button" value="2">
<script>
$('input').toggle();
</script>
- 点击计数
VQuery.prototype.toggle = function() {
var i =0;
var count =0;
for (var i = 0; i < this.elements.length; i++) {
myAddEvent(this.elements[i],'click',function(){
alert(count++);
})
}
};
计数器使用同一个count的情况
VQuery.prototype.toggle = function() {
var i = 0;
for (var i = 0; i < this.elements.length; i++) {
addToggle(this.elements[i]);
};
function addToggle(obj) {
var count = 0; //count挪到这个位置
myAddEvent(obj, 'click', function() {
alert(count++);
});
}
};
实现以后的效果,分别计数
-
arguments
的使用
现在来实现这样的效果
$('input').toggle(function() {
alert('a')
},function(){
alert('b')
},function(){
alert('c')
});
下面来实现方法:
VQuery.prototype.toggle = function() {
var i = 0;
var _arguments = arguments;
for (var i = 0; i < this.elements.length; i++) {
addToggle(this.elements[i]);
};
function addToggle(obj) {
var count = 0; //count挪到这个位置
myAddEvent(obj, 'click', function() {
console.log(arguments)
arguments[count%arguments.length].call(obj);
count++;
});
}
};
报错:Uncaught TypeError: arguments[(count % > arguments.length)].call is not a function
查看arguments
为空
arguments为空
因为这里arguments
的function
参数为0个。
function() {
console.log(arguments)
arguments[count%arguments.length].call(obj);
count++;
}
要调用toggle
的argument
,老方法,定义_arguments
。最后的结果:
VQuery.prototype.toggle = function() {
var i = 0;
var _arguments = arguments;
for (var i = 0; i < this.elements.length; i++) {
addToggle(this.elements[i]);
};
function addToggle(obj) {
var count = 0; //count挪到这个位置
myAddEvent(obj, 'click', function() {
_arguments[count%_arguments.length].call(obj);
count++;
});
}
};