Re: [問題] JQuery的selecters抓特定格式的class

看板Ajax作者 (crpkt)時間10年前 (2013/10/28 16:40), 編輯推噓7(7推 0噓 23→)
留言30則, 5人參與, 最新討論串2/2 (看更多)
※ 引述《LaPass (LaPass)》之銘言： : 用JQuery的Selectors : 可以把.myclass的物件抓出來 : 像這樣: : $('.myclass') : 請問有沒有辦法 : 一次就把含有 myclass開頭的class都抓出來呢？ : 例如: : myclass_0 : myclass_1 : myclass_x : myclass_day_1 : .....
→
10/28 14:48,
*[class^="myclass_"]
10/28 14:48
推
10/28 14:55,
樓上這樣抓不到<span class="abc myclass_1">
10/28 14:55
→
10/28 14:57,
那就用 *= 吧
10/28 14:57
推
10/28 15:00,
樓上這樣會抓到<span class="notmyclass_1">
10/28 15:00
→
10/28 15:01,
那有更準的 selecotr 嗎？
10/28 15:01
推
10/28 15:05,
目前沒想到不靠filter的精準方法 所以我沒跳出來回答
10/28 15:05
很接近了，Bootstrap 2.3.2 的 icon 在 CSS 裡是用這組 selector： [class^="icon-"], [class*=" icon-"] 但是 3.0 的時候因為效能問題把它改了，規格改成使用者必須自行額外加上 .icon jQuery 有自己的 selector engine，但是去撈 attribute 理論上難免比較慢。 所以如果你的目的純粹是撈元件，或許你把規格改成 myclass myclass_0 myclass myclass_1 myclass myclass_x myclass myclass_day_1 然後直接撈 $('.myclass') 比較簡單； 要不然就是撈 $('[class^="myclass_"], [class*=" myclass_"]')， 然後記得測一下效能... -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 220.135.202.140
→
10/28 16:42, , 1F
了解~ 感謝~ ^^
10/28 16:42, 1F
推
10/28 17:38, , 2F
啊 居然這麼簡單!?
10/28 17:38, 2F
→
10/28 17:38, , 3F
不過這效能上真的值得考慮 改天拿來跟用filter的方式
10/28 17:38, 3F
→
10/28 17:39, , 4F
比比看
10/28 17:39, 4F
推
10/28 18:06, , 5F
10/28 18:06, 5F
→
10/28 18:07, , 6F
用我的瀏覽器看起來是寫成jquery plugin的filter快很多
10/28 18:07, 6F
→
10/28 18:08, , 7F
當然用selector好像還是比較方便....
10/28 18:08, 7F
→
10/28 19:29, , 8F
selector慢是因為被jQuery的解譯拖累了...
10/28 19:29, 8F
→
10/28 19:33, , 9F
http://jsfiddle.net/QxN7Z/1/ 這測試就很明顯了
10/28 19:33, 9F
→
10/28 19:33, , 10F
因為filter會針對每個jQuery都重新解析一次filter
10/28 19:33, 10F
→
10/28 19:34, , 11F
會導致那段有複雜度的code被jQuery解析上萬次...
10/28 19:34, 11F
→
10/28 19:35, , 12F
倒過來 最後在過濾span效率就截然不同了
10/28 19:35, 12F
→
10/28 19:36, , 13F
不過如果瀏覽器不支援CSS3的話...
10/28 19:36, 13F
→
10/28 19:36, , 14F
用selector大概不管怎樣會慢到死了XDD
10/28 19:36, 14F
→
10/28 19:37, , 15F
改一下 native那個忘了過濾span XD
10/28 19:37, 15F
→
10/28 19:37, , 16F
10/28 19:37, 16F
推
10/29 09:23, , 17F
真是驚人 先做attr selector再做tag selector居然會
10/29 09:23, 17F
→
10/29 09:23, , 18F
比較快....完全反直覺啊XD 雖然以前好像就看過類似說
10/29 09:23, 18F
→
10/29 09:23, , 19F
法不過沒記到心裡....XD
10/29 09:23, 19F
推
10/29 09:27, , 20F
不過querySelectorAll要ie9以後啊....
10/29 09:27, 20F
推
10/29 09:41, , 21F
10/29 09:41, 21F
→
10/29 09:42, , 22F
實測上attribute selector比class selector慢約75%
10/29 09:42, 22F
→
10/29 09:51, , 23F
而DOM變得複雜時，attribute selector的效能會更差
10/29 09:51, 23F
推
10/29 10:09, , 24F
喂喂 直接拿[.class]跟[抓特定開頭class]的功能做效能
10/29 10:09, 24F
→
10/29 10:09, , 25F
比對這樣對嗎?XDDD
10/29 10:09, 25F
→
10/29 10:10, , 26F
當然直接把所有myclass_xxx加上myclass絕對是最快的
10/29 10:10, 26F
→
10/29 10:11, , 27F
我的意思是....能這樣做當然就這樣做最好....
10/29 10:11, 27F
→
10/29 12:50, , 28F
只有我覺得命名成這樣就是個錯誤的開始嘛 XD
10/29 12:50, 28F
推
10/29 13:26, , 29F
很多時候你不得不在錯誤的基礎上展開工作啊....(遠目)
10/29 13:26, 29F
→
10/29 13:40, , 30F
現實啊 （嘆氣）
10/29 13:40, 30F
‣ 更多 CRPKT 的文章
文章代碼(AID): #1IRYBf66 (Ajax)
‣ 更多 CRPKT 的文章
文章代碼(AID): #1IRYBf66 (Ajax)