最近使用 jQuery 时发觉使用$选择器和.on 绑定事件时比较容易混淆的几个问题，备忘一下，就怕哪天自己也迷糊了。

一、选择器

$('#one', '#two')

子父关系$(‘子’, ‘父’)，是从父节点里找子，也就是从#two 里面查找#one。

$('#one, #two')

不存在父子关系，查找所有的#one 和#two。

$('#one #two')

父子关系$(‘父 子’)，是从父节点里找子，也就是从#one 里面查找#two。

二、绑定多个事件

相同回调代码：

$('.class').on('click blur focus', function () {
    //回调
});

不同回调代码：

$('.class').on({
   click: function () {
       //回调
   },
   mouseover: function () {
       //回调
   },
   mouseout: function () {
       //回调
   }
});

三、监听元素变化

表单元素：

$('.form').on('change', function () {
    //回调
});

HTML 元素：

$('.class').on('DOMNodeInserted DOMNodeRemoved', function () {
    //回调
});

其它的 DOM mutation 事件：

• DOMAttrModified
• DOMAttributeNameChanged
• DOMCharacterDataModified
• DOMElementNameChanged
• DOMNodeInserted
• DOMNodeInsertedIntoDocument
• DOMNodeRemoved
• DOMNodeRemovedFromDocument
• DOMSubtreeModified