jQuery中 对标签元素操作（2）

一、属性操作

1、获取属性和设置属性

例如下jQuery代码：

var $para=$("p");           //获取<p>节点

var p_txt=$para.attr("title");       //获取<p>元素节点属性title

var id = parseInt($("img").parent().prop("id"));   //获取图片标签的父元素的属性ID的值

注意：

jQuery中的很多方法都是同一个函数实现获取（getter）和设置（setter）的，例如 attr（）方法，既能设置元素属性的值，也能获取属性的值。类似的方法还有html（）、text（）、height（）、width（）、val（）、css（）等。

2、删除属性

如果需要删除<p>元素的title属性，可以视同下面的代码实现：

$("p").removeAttr("title");     //删除<p>元素的title属性

二、样式操作

1、获取样式和设置样式

$("p").attr("class");    //获取<p>元素的class

$("#Text1").css("color", "#ACACAC");     //将ID为Text1的元素的文本颜色设置为#ACACAC

2、追加样式

$("p").addClass("another");   //给<p>元素追加“another”类

3、移除样式

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

4、切换样式

<p>元素的HTML原始代码：

<p class="myclass" title="test">test</p>

当点击“切换样式”按钮后，变为：

<p class="myclass another" title="test">test</p>

当再次单击“切换样式”按钮时，又变回原来的状态

<p class="myclass" title="test">test</p>

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

hasClass()

用法：

$("p").hasClass("another");    　　//判断此元素中是否含有“another”的class

$("p").is("another");      //作用同等于如上代码

三、设置和获取HTML，文本和值

1、HTML（）方法

$("p").html();    　　//获取<p>元素的HTML代码

$("p").html("<strong>叫我大哥</strong>");　　//设置<p>元素的HTML代码

2、text（）方法

$("p").text();　　　　//获取<p>元素的text

$("p").text("叫我大哥");　　　　//设置<p>元素的text

3、val（）方法

$("input").val();　　　　//获取<input>元素的val

$("input").val("叫我大哥");　　//设置<input>元素的val

四、遍历节点

1、children（）方法

该方法用于取得匹配元素的子元素的集合。

2、next（）方法

var $p1=$("p").next();　　　　//得到紧邻<p>元素后的同辈元素

3、prev（）方法

var #ul=$("ul").prev();　　　　//得到紧邻<ul>元素前的同辈元素

4、siblings（）方法

var sp2=$("p").siblings();　　　　//得到紧邻<p>元素的同辈(兄弟)元素