作者KeithYeh (棒球癡)
看板Web_Design
標題Re: [問題] jQuery選擇器問題
時間Sat Apr 27 21:55:06 2013
※ 引述《supercygnus (......)》之銘言：
: 請問
: $("div").find('p:first').css("border-color","#FF9D37");
: $("div p:first").css("border-color","#FF9D37");;
: 這兩者為什麼效果不一樣,要怎麼理解呢~?
: 用以下程式碼去測試就知道了
: <div>
: <p class="testClass">
: 測試1<span>子元素1</span>
: </p>
: </div>
: <br>
: <div class="testClass">
: <p class="testClass">
: 測試2<span>子元素2</span>
: </p>
: </div>
首先要釐清的是 $(":first") 這個選擇器
:first 並不是CSS的選擇器
是jQuery延伸出來的API，說明頁：
http://api.jquery.com/first-selector/
裡面就寫道，這玩意兒只會作用在第一個match到元素上
$("div").find('p:first').css("border-color","#FF9D37");
這行執行後的結果是先選到所有div元素，再從每個div元素下去尋找p:first
所以你會看到兩個元素都作用到了
$("div p:first").css("border-color","#FF9D37");
而這行只會作用在第一個match到的 "div p" 元素上面，所以只有第一個被改變了
範例碼：
http://jsfiddle.net/6sG3T/
有錯請指正，感激不盡 <(_ _)>
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 114.41.174.20
1F：推 f1234518456: 04/27 22:24