Skip to main content

Tedshd's Dev note

Category: Jquery

jQuery-design pattern

# modulize modulize selector var module = $('body'); module.on('click', 'a', function() { // dosomething... }); initialize if ($('body').length) { // dosomething } # selector id is better than tag and class HTML <div> <ul> <li id="id" class="class">text</li> </ul> </div> JavaScript $('#id').html(); $('body').find('#id'); jsperf ##bind event use on bind on parent selector $('ul').on('click', 'li', function () { // dosomething }); js Bin ...

jQuery selector

* 所有元素 E 所有E元素, E:nth-child(n) 傳回在所屬父元素下,排行第 n 的元素 E。(注意: 從 1 開始算,而非從 0) E:first-child 傳回在所屬父元素下,排行第一的元素(老大) E:last-child 傳回在所屬父元素下,排行最後的元素(老么) E:only-child 傳回在所屬父元素下,是唯一子元素(獨子) E:empty 沒有任何子元素者(有文字也不算,例如 <span>TEXT</span> 就不合格) E:enabled 未被停用的 UI 元素 E E:disabled 被停用的 UI 元素 E E:checked 被勾選的 UI 元素 E(適用於 Radio, Checkbox) E:selected 被選取的 UI 元素 E(適用於 Select 下的 Option 元素) E.myClassName CSS 類別設為 myClassName 的元素 E E#myId id="myId" 的元素 E E:not(s) 不符合 s 條件的元素 E,例如: $("span:not(:empty)") 即為找出有包含子元素的 span E F 由包含在 E 底下的 F 元素,不必直接為父子關係,例如: F 可以是 E 的子元素的子元素。 E > F 找出父元素為 E 的 F 元素 E + F 找出緊接在 E 元素後方的 F 元素 E ~ F 找出緊接在 E 元素前方的 F 元素 E,F,G 利用逗號可以呈現 " 或 " 的聯集效果,指 E 元素或 F 元素或 G 元素 E[foo] 具有 foo 屬性 (Attribute) 的E元素(1. ...