引言:JQUERY作为优秀的javascript框架之一,被广泛的引用。在实际的项目中,JQUERY可以大大简单的工作量,并且JQUERY中优秀方法可以快捷方便的解决很多问题。
JQUERY的简单理解
我们可以将JQUERY理解一个类,该类的命名控件是$。
1.首先明确:类中可以有属性,也可以有静态的方法以及成员方法。
例如,$.trim()就可以理解为JQUERY的一个静态方法,我们在就是中可以直接使用,我们也可以使用$.extend({...})去定义自己想要的静态方法去扩展JQUERY类库;
下面举例说明用法:
$.extend({
caculate:function(arg1,arg2){return arg1+arg2;}
})
就是计算两个值的和,在js代码中直接调用即可,即:$.add(1,2);返回结果就是3。(ps:当然,在你的js中必须引用你自定义的js文件或者放在你自定义方法的后面....)
2.其次:需明确,类似JQUERY中的选择器$("#main")而获得到的DOM元素就是JQUERY类的一个实例化对象。众所周知,你实例化一个类对象之后,就可以操作该类对象,比如获取该类对象的属性值、通过该类对象调用你在类中定义的方法等。
<div id="test" myTest="shangwuyuyi"/>
$("#test").attr("myTest");就是获取到了该div的属性myTest。当然,你也可以为该div添加一些属性,例如
$("test").attr("class","main");
就是为该div添加class属性。(这些都不用我写...各位大神肯定对此不屑一顾...)
我想说的是Jquery.fn.extend,这是对prototype的扩展,其实就是为实例了JQUERY的类对象添加成员方法。下面举个例子:
$.fn.extend({
alertWhileClick:function(){
alert($(this).attr("id"));
}
}
就是为实例化了的对象新定义了一个成员函数,在实际调用中,就使用$("#test").alertWhileClick();就可以弹出该div的id值了。