29

常用jQuery方法分类汇总(待续)

jQuery减少了代码的书写量,为前端开发节省了很多时间。有关于JavaScript常用函数请看这里 JavaScript常用函数收集

一、jQuery添加移除CSS类的方法

1 . addClass() – 添加CSS类

$(“#target”).addClass(“newClass”);

//#target 指的是需要添加样式的元素的ID

//newClass 指的是CSS类的名称

2 . removeClass() – 移除CSS类

$(“#target”).removeClass(“oldClass”);

//#target 指的是需要移除CSS类的元素的ID

//oldClass 指的是CSS类的名称

3 . toggleClass() – 添加或者移除CSS类:如果CSS类已经存在,它将被移除;相反,如果CSS类不存在,它将被加上。

$(“#target”).toggleClass(“newClass”);

//如果ID为“target”的元素已经定义了CSS样式,它将被移除;

//反之,CSS类”newClass“将被赋给该ID。

jQuery还提供用来判断某个元素是否已经被赋予某个CSS类的方法,如下:

1 . hasClass()方法是用来检查被选择的元素是否包含指定的class名,其语法:

$(selector).hasClass(“className”);//其中class是必须的值,规定需要在指定元素中查找的类名。

hasClass()也可以同时写多个class但他们之前用空格隔开,如下:

$(selector).hasClass(“className1 className2″);

2 . is()方法也是用来检查被选择的元素是否包含指定的class名,其用法为:

$(selector).is(“.className”);

同样is()也可以有多个类名的写法,如下:

$(selector).is(“.className,.className”);

hasClass()方法与is()方法有同各功能,但hasClass()方法的用时较短,所以说hasClass()方法在性能上是优于is()方法的。
Continue reading

10

jQuery DOM 元素方法index()方法获取值为-1,得不到正确的值

$(selector).index()获得第一个匹配元素相对于其同胞元素的 index 位置

不懂装懂,帮朋友修改一个JS效果(点击后不显示同胞元素),JQ方法功能也是现查的手册,测试index()返回值是-1,这一定是不正确了。

结果就是一阵的百度搜索,在开源中国的一篇文章中得到了启发:

$(".newsList dd").eq($(".newsTab dd.hover").index()).show();
修改为
$(".newsList dd").eq($(".newsTab dd").index($(".hover"))).show();

解释:

$(“.newsTab dd”)表示找到newsTab类下的所有的dd,返回一个dd的数组的对象;

后面的.index($(“.hover”))表示返回数组对象中的class为hover的对象的坐标。