jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务

$(元素).bind("click",function(){});
//on
$(元素).on("click",function(){});
//比如
$("div").on("click",function(){});

//含义：即将原本发生在元素身上的事件委托给父级来监听。适用于给未来的元素绑定
   //即不给元素绑定，而是给祖先绑
   <ul>
       <li>123</li>
       <li>123</li>
   </ul>
   //原本要给li标签绑定事件，但是现在不给他绑，而是代理给它父级来绑定
   <script>
       //不用事件委托：
       $("li").on("click",function(){});
       //用了事件委托：
       $('祖先').on("原本要绑定事件的元素","click",function(){});
       //比如：
       $('ul').on("click","li",function(){});
   </script>

1. 
$("div").click(function(e){
    console.log(e);
    //打印，得到该对象的宝库，所有的方法和属性
});
2.
$("div").bind("click",function(e){
    console.log(e);
});
3.
$('ul').on("click","li",function(e){});

//任何元素都有滚动条事件，只要该元素有滚动条，就可以给其绑定滚动条事件，从而在滚动滚动条时，触发它
$("body").on("scroll",function(){
});

1. 高度
//JS
元素.scrollTop;
//JQ:
$(元素).scrollTop();
2. 宽度
元素.scrollLeft;
//JQ:
$(元素).scrollLeft();

1. 总高
元素.scrollHeight;
//JQ没有，用JS的来代替
2. 总宽
元素.scrollWidth;
//JQ没有，用JS的来代替

//一个元素有2个父级，直接父级，一个是定位父级
JS：
元素.parentNode;//亲爹
元素.offsetParent;//干爹，会改，跟着css的postion
JQ:
$(元素).parent();//亲爹
$(元素).offsetParent();//干爹

一般我们只需要该元素到浏览器最左侧和最顶部的绝对距离
//JS ，自己写了一个方法：getPos()
元素.getPos().left;
//JQ不需要自己造轮子，直接调用它给我们封装好的方法，直接用即可
$("元素").offset().left;

$("元素").offset().top;