PTT數位生活區 / Ajax

[問題] jQuery可以包成DOM物件嗎?

看板Ajax作者 (第三個…)時間14年前 (2012/02/02 19:08), 編輯推噓5(5推 0噓 16→)
留言21則, 8人參與, 最新討論串1/2 (看更多)
請問jQuery可以包成DOM物件嗎? jQuery可以像這樣 var jq = $("#div1"); 取得jQuery物件。 但有時要用DOM物件就得 var js = document.getElementById("div1"); 這樣一長串。 有比較簡潔的方法嗎?有時還是想用DOM物件的，像是取得name之類的。 謝謝各位的解答。 -- http://www.youtube.com/watch?v=zqzVtROqPQI
お耳がぴょんぴょん♪ともちんこと板野友美です。 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 114.137.254.54
推
02/02 19:16, , 1F
$("#div1")[0]
02/02 19:16, 1F
→
02/02 19:16, , 2F
如果有多個物件就改成[1]、[2]... 以此類推
02/02 19:16, 2F
→
02/02 19:50, , 3F
喔喔!這個方法好棒!感謝!
02/02 19:50, 3F
→
02/02 19:58, , 4F
那叫 DOM 物件 ..
02/02 19:58, 4F
※ 編輯: TheThird 來自: 114.137.254.54 (02/02 20:08)
推
02/03 03:18, , 5F
怕麻煩你也可以寫個func直接return doc.getElementById('')
02/03 03:18, 5F
→
02/03 10:32, , 6F
而且jq也能直接取得.attr('name')呀 既然都用jq了 還有什
02/03 10:32, 6F
→
02/03 10:33, , 7F
麼地方會有必要轉成DOM再操作純js?
02/03 10:33, 7F
我剛好遇到一個例子用jQuery不行要用DOM。 $("#mySelect").append("<option value='foo'>foo</option>"); 這行雖然可以將option加入select，但在IE6上不知道為什麼會出錯@@ 所以我後來改用DOM的方式加入option。 function appendOption(content){ var elOptNew = document.createElement('option'); elOptNew.text = content; elOptNew.value = content; var elSel = document.getElementById('mySelect'); try { elSel.add(elOptNew, null); } catch(ex) { elSel.add(elOptNew); // IE only } } 只是用DOM，打document.getElementById('mySelect')感覺很累XD 改成$('#mySelect')[0]就比較簡短了!
推
02/03 11:07, , 8F
聽說某些操作 使用DOM現成的東西會比較快...
02/03 11:07, 8F
推
02/03 19:23, , 9F
肯定比較快的 跑一次jQuery function最後還不是要用DOM去
02/03 19:23, 9F
→
02/03 19:23, , 10F
取 可是這樣就比較難維護 原始碼比較亂
02/03 19:23, 10F
※ 編輯: TheThird 來自: 114.136.233.190 (02/03 20:13)
→
02/03 21:39, , 11F
select 跟 option 的關係比較特別
02/03 21:39, 11F
→
02/03 21:39, , 12F
要作的話，基本上這樣會比較好。
02/03 21:39, 12F
→
02/03 21:40, , 13F
http://jsfiddle.net/K2SbJ/ 這是經驗問題 加油 ;)
02/03 21:40, 13F
→
02/03 22:02, , 14F
樓上這個網站好棒!
02/03 22:02, 14F
感謝TonyQ大的提供，不過嘗試後發現了幾個問題。 http://jsfiddle.net/Vxj4c/ appendOptions是改寫TonyQ大的使用jQuery的function， appendOptions2則是使用DOM的function。 使用jQuery append option，length是空的，如果之後要設定selected 之類的就沒辦法(不能用索引找option比對特定value或text)。 用DOM append的就可以。 ※ 編輯: TheThird 來自: 163.23.72.51 (02/04 08:58)
推
02/05 14:24, , 15F
這樣是你要的嗎? http://jsfiddle.net/YemB5/1/
02/05 14:24, 15F
→
02/05 15:46, , 16F
innerhtml
02/05 15:46, 16F
→
02/06 17:12, , 17F
感謝amosa提供。
02/06 17:12, 17F
→
02/06 20:21, , 18F
其實我被你騙到了...你會拿到length 是空
02/06 20:21, 18F
→
02/06 20:21, , 19F
是因為你把 meSelect 打成 mySelect
02/06 20:21, 19F
→
02/06 20:21, , 20F
selector 還是會 work 的，難怪我總覺得怪怪的。
02/06 20:21, 20F
→
02/06 21:07, , 21F
真的耶，我也沒發現XD
02/06 21:07, 21F
‣ 更多 TheThird 的文章
文章代碼(AID): #1FAcwc6h (Ajax)
討論串 (同標題文章)
以下文章回應了本文：
完整討論串 (本文為第 1 之 2 篇)：
排序： 最新先 | 最舊先 | 留言數
在新視窗開啟完整討論串 (共2篇)
Ajax 近期熱門文章
更多 近期熱門文章 >>
PTT數位生活區 即時熱門文章
更多 即時熱門文章 >>
‣ 更多 TheThird 的文章
文章代碼(AID): #1FAcwc6h (Ajax)