作者ybite (小犬)
看板Web_Design
標題Re: [心得]從 js 到 jQuery 之二:無所遁形之selector
時間Fri Aug 8 12:02:14 2008
恕刪
※ 引述《TonyQ (沉默是金)》之銘言:
: @等等 , 既然 selector 取的是網頁元素 , 那他是dom元素嗎?
: 你或許會想知道 $("table").style.display='none' 的結果.
: 答案會是 style is undefined , 因為$("table")是個 jquery Context ,
: 他只能處理他提供給你的方法 , 那你如果比較習慣 js 的作法 ,
: 不想查jquery 文件 ,有沒有搞頭?
: 有!
: 你可以透過 $("table")[0] 取得「第一個表格」的html dom物件 ,
: 也就是 $("table")[0].style.display='none'會是可行的 .
: 如果你想對所有裡面的元素做存取, 你也可以這麼做 .
: var jqTable=$("table");
: for(var i =0; i <jqTable.length ;++i){
: jqTable[i].style.display='none';
: }
: 就純粹把它當個陣列來看.
如果用jQuery的方法可以用each
http://docs.jquery.com/Core/each
所以上述程式和下面的一模一樣:
$('table').each(
function (i) { this.style.display = 'none'; }
);
: @selector 只有這樣嗎? 好像沒什麼差?
: 當然以目前講的這些東西 , 要取得目標物好像還差些什麼 ,
: 我們總是常常會有這樣的狀況 , 比方說在特定table的 td 的裡面的div,
: (這樣由父結構到子結構的關係 , 有個 xml的 專有名詞xpath 可描述)
: 我們也是可以混著用 , 如 $("#tableid td div") ,
: 就表示搜尋 id叫 tableid 的元素裡面的 td tag裡面的 div tag.
: 當然 除了父,子關係外 , 還有 「或」 的關係.
: 比方說 $("#testid1,#testid2") 中間用逗號隔開表示都可以,
: 也就是這樣會取得 id=testid1 跟 id=testid2的物件.
我有一次把selector寫得很複雜(CSS的popup),做個參考:
#list > li:hover > ul /* XD */
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.112.4.235
推 TonyQ:感謝捧場XD, 順便分享給其他朋友 each的i是從0開始的index. 08/08 12:08
→ TonyQ:還有 在這裡 > 是表示嚴格父子(目標必須就在下一層) 08/08 12:08
→ TonyQ:#list li:hover 則是 #list所包含的任意li:hover 較為鬆散 08/08 12:09
→ TonyQ:提供給大家參考. ^^a 08/08 12:09