jQuery事件

117 阅读1分钟

键盘事件

按下键盘时     keydown( )

释放按键时     keyup( )

连续敲击键盘的时候触发     keypress( )

鼠标移入移出

hover( )由mouseenter和mouseleave组成

mouseenter( )和mouseleave( ) ★在进入子元素区域的时候不会触发

mouseover( )和mouseout( ) 在进入子元素区域的时候也会触发

链式调用

jq可以链式调用(链式调用的原理 jq里面的方法都会return this 把当前调用者return出去 实现链式调用)

$('div').text('我是学生').css('color','red').attr({name:'zhangsan',age:30})

end( ):结束当前链条中的最近的筛选操作,并将匹配元素集还原为之前的状态

滚动条

scrollLeft([position]) 参数可选。设置或返回匹配元素相对滚动条左侧的偏移

scrollTop([position]) 参数可选。设置或返回匹配元素相对滚动条顶部的偏移

获取滚动条距离

console.log( $(window).scrollLeft() )

设置滚动条距离

$(window).scrollLeft(600)

jq提供的监听滚动条事件

$(document).scroll(function(){

             console.log( $(document).scrollTop() )

         })
//原生的方法:
// document.onscroll = function(){

        //     console.log( document.documentElement.scrollLeft )

        // }

position( ) 返回第一个匹配元素相对于父元素的位置

console.log( $('div').position() )

offsetParent 返回最近的已定位祖先元素。

定位元素指的是元素的CSS

position值被设置为relative、absolute或fixed的元素

console.log( $('.div2').offsetParent() )

width和height:

width( )和height( )获取的只是content里面的距离(不包括padding margin border)

console.log($('div').width());console.log($('div').height());

offset()返回以像素为单位的top和left坐标。仅对可见元素有效 (★top 和 left值会包括自己的margin值和父元素的border值)

console.log( $('.div2').offset().top );

console.log( $('.div2').offset() );