JQuery自定义事件，事件冒泡，节点

/单次绑定事件/
.fn.bindOne = function (eventName, fn, childEle) { if (!childEle) {(this).unbind(eventName).on(eventName, fn);
} else {
$(this).unbind(eventName).on(eventName, childEle, fn);
}
};

首先事件冒泡也是自下而上，不断扩大。简单的解释一下吧，就是在子元素和父元素上都定义了同一事件，比如click事件，当我们点击子元素的时候，会同时触发该元素以及拥有同一事件的该元素的所有父元素，并且会从该元素开始，向上一级一级的执行其定义的事件函数。

这里又涉及到两种情况：

默认事件，比如a标签

特殊事件，比如click

既然提到事件冒泡，我们不妨谈谈如何阻止事件冒泡吧，因为事实上它对我们的操作是有反作用的。

阻止事件冒泡的方式有三种：

event.stopPropagation();

这种处理方式，阻止了事件冒泡，但是不会阻止默认行为。也就是说可以阻止click等事件，但是不会阻止a这样的点击跳转的默认行为。

return false；
这种处理方式，既阻止了事件冒泡，也会阻止浏览器默认行为。也就是说click事件不会响应，a标签也不会跳转。

3.event.preventDefault();

这种处理方式，只阻止默认行为，不阻止特定事件。也就是说a不会跳转，click事件无法阻止。

通过 JQuery 节点操作的办法来实现交互，减少手动添加类名操作。优点是能够减少重复功能代码，缺点是如果模板类名调整或者结构调整会导致功能交互出现问题。

1 父级节点
$.parent(selector)
当没有指定父级节点类型时，会默认为所有。

例如:

href_fir
href_sec
href_thr

href_fiv

2 子级节点
2.1 $.find(selector, object, element)

2.2 $.children(selector)
_parent.find('img').attr('src');

$(this).children("input[name='content']").val();
通过上面的例子可以看到， find() 和 children() 在功能实现上面效果一致，但是 find() 效果更加灵活，但是也有必填的限制就是需要 selector，而 children() 可以省略 selector,则默认为当前对象的第一个子元素节点。

3 同级节点
3.1 .next(selector) 3.2.nextAll(selector)
3.3 .prev(selector) 3.4.prevAll(selector)
.next(selector) 获取当前对象的下一个同级元素节点.nextAll(selector)
获取指定元素后边的所有同级元素,可以通过 selector 来确定具体的同级元素
.prev(selector) 获取指定元素的上一个同级元素.prevAll(selector)
获取指定元素的前边所有的同级元素，可以通过 selector 来具体对应的同级元素