夜光带你走进Jquery（5）

夜光序言：

 

人最大的对手，往往不是别人，而是自己的懒惰。别指望撞大运，运气不可能永远在你身上，任何时候都要靠本事吃饭。你必须拼尽全力，才有资格说自己的运气不好。

 

 

 

 

 

正文：

next()  next(expr)  返回匹配对象剩余的兄弟节点 

<p>Hello</p><p id="a">Hello Again</p><p class="selected">And Again</p>

jQuery代码及功能

function jq(){
        alert($("p").next().html());
        alert($("p").next(".selected").html());
}

$("p").next()返回 [ <p id="a">Hello Again</p> , <p class="selected">And Again</p> ]两个对象
$("p").next(".selected)只返回 [<p class="selected">And Again</p> ]一个对象

prev ()  prev (expr)  参照next理解

not(el)  not(expr)  从jQuery对象中移出匹配的对象，el为dom元素，expr为jQuery表达式。 

<p>one</p><p id="a">two</p>
<a href="#" onclick="js()">jQuery</a>

jQuery代码及功能：

function js(){
     alert($("p").not(document.getElementById("a")).html());
     alert($("p").not(“#a”).html());
}

$("p")由两个对象，排除后的对象为[<p>one</p> ]

---

siblings ()  siblings (expr)  jquery匹配对象中其它兄弟级别的对象 

 

<p>one</p>
<div>
  <p id="a">two</p>
</div>
<a href="#" onclick="js()">jQuery</a>

jQuery代码及功能：

function js(){
       alert($("div").siblings().eq(1).html());
}

$("div").siblings()的结果实返回两个对象[<p>one</p>，<a href="#" onclick="js()">jQuery</a> ]
alert($("div").siblings(“a”)返回一个对象[<a href="#" onclick="js()">jQuery</a> ]

其他
addClass(class)   为匹配对象添加一个class样式
removeClass (class)   将第一个匹配对象的某个class样式移出

attr (name)   获取第一个匹配对象的属性<img src="test.jpg"/><a href="#" onclick="js()">jQuery</a> 

jQuery代码及功能：

function js(){
     alert($("img").attr("src"));
}

返回test.jpg

 

---

attr (prop)   为第一个匹配对象的设置属性，prop为hash对象，用于为某对象批量添加众多属性 

 

<img/><a href="#" onclick="js()">jQuery</a>

jQuery代码及功能：

function js(){
     $("img").attr({ src: "test.jpg", alt: "Test Image" });
}

运行结果相当于<img src="test.jpg" alt="Test Image"/>

 

---

attr (key,value)   为第一个匹配对象的设置属性，key为属性名，value为属性值 

 

<img/><a href="#" onclick="js()">jQuery</a>

jQuery代码及功能

function js(){
     $("img").attr(“src”,”test.jpg”);
}

运行结果相当于<img src="test.jpg"/>

 

 

---

removeAttr (name)   将第一个匹配对象的某个属性移出 

 

<img alt="test"/><a href="#" onclick="js()">jQuery</a>

jQuery代码及功能：

function js(){
     $("img"). removeAttr("alt");
}

运行结果相当于<img />

toggleClass (class)   将当前对象添加一个样式，不是当前对象则移出此样式，返回的是处理后的对象 

<p>Hello</p><p class="selected">Hello Again</p><a href="#" onclick="js()">jQuery</a>

$("p")的结果是返回对象 [<p>Hello</p>,<p class="selected">Hello Again</p> ]
$("p").toggleClass("selected")的结果是实返回对象 [ <p class="selected">Hello</p>, <p>Hello Again</p> ]