jQuery开发之DOM操作三

来源:互联网 发布:三明学院网络教学平台 编辑:程序博客网 时间:2024/06/01 10:44

1,属性操作
(1)获取属性和设置属性
获取<p>元素的title属性示例代码如下:

var $para =$("p");var p_title =$para.attr("title");

设置单个属性的jQuery示例代码如下:

var $para =$("p");$para.attr("title","your title");

设置多个属性的jQuery的示例代码如下:

var $para =$("p");$para.attr("title":"your title","name":"your name");

(2) 删除属性
删除属性一般用removeAttr()方法
如果需要删除<p> 元素的title属性,jQuery示例代码如下:

$("p").removeAttr("title");

2,样式操作

(1)获取样式和设置样式
使用attr()方法来获取<p> 元素的class,jQuery示例代码如下:

var p_class =$("p").attr("class");

也可以使用attr()方法来设置<p> 元素的class,jQuery示例代码如下:

$("p").attr("class","high");

(2) 追加样式
设置元素的class是将原来的class替换为当前的class,而addClass()方法则不是而是和原来的class进行叠加。 jQuery示例代码如下:

$("p").addClass("anotherClass");

(3)移除样式
jQuery示例代码如下:

$("p").removeClass("high"); //移除<p>元素中值为high的class

移除多个class 的jQuery示例代码如下:

$("p").removeClass("class1 class2 class3"); //移除<p>元素中的多个class

(4)切换样式
jQuery提供了toggleClass()方法控制样式上的重复切换。如果类名存在就删除它,不存在就添加它
jQuery示例代码如下:

$("p").toggleClass("another");//重复切换名为another的class

(5) 判断是否含有某个样式
hasClass()可以用来判断元素中是否含有某个class,如果有那么返回true,没有的话返回false。jQuery示例代码如下:

$("p").hasClass("another");

该方法的等价于下面的代码:

$("p").is("another");
0 0