锋利的Jquery——学习笔记（五）DOM操作（二）

Jquery中的DOM操作（二）

八、属性操作 attr()

1、获取和设置属性

$("p").attr("title");//第一个参数为获取属性的名字
$("p").attr("title","wahaha");//第二个参数可以用来设置属性
$("p").attr("title":"wahaha","name":"大好人");//以键值对的形式同时设置多个属性的值

2、删除属性 removeAttr()

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

九、样式操作

1、获取和设置样式

$("p").attr("class","high");//强调的是用新的样式代替原来的样式

2、追加样式

追加样式是在原来class基础上继续添加新的样式

$("ul li:eq(1)").onclick(function(){
    $("p").addClass("another");//给<p>元素继续添加“another”类
})

对于类的规定：
（1）不同的class设置的样式可以进行合并
（2）不同的class设置同一个样式，则后面的样式可以覆盖前面的样式

3、移除样式 removeClass()

$("p").removeClass("high");//移除一个class
$("p").removeClass("high another");//以空格分隔，同时删除多个类
$("p").removeClass();//不含任何参数时，则移除所有的类

4、切换样式

toggle();// 重复切换方法
toggleClass();// 重复切换类的添加和删除

5、判断是否含有某个样式

hasClass()；//判断是否含有某个类，如果又则返回“true”，没有就返回“false”

$("p").hasClass("another");
$("p").is(".another"); //两种方法均可

十、设置和获取HTML、文本和值

1、HTML()方法

读取或设置指定元素中的HTML内容

$("p").html("<strong>我是大好人</strong>");

2、text()方法

对某元素的文本内容进行读取或设置

$("p").text("我是大好人");

3、val()方法

设置或获取元素的值

十一、遍历节点

1、children()方法

获取所有子元素，且只考虑子元素，不考虑后代元素

2、next()方法

获取后面紧邻的同辈元素

3、prev()方法

获取前面紧邻的同辈元素

4、siblings()方法

获取匹配元素前后所有同辈元素

5、closest()方法

查找最近的匹配元素，如果不匹配，则查找上一级，依次向上，直到根节点，如果仍旧不存在，则返回空值

十二、CSS-DOM操作

1、css()方法

2、offset()方法

3、position()方法

4、scrollTop和scrollLeft()方法