mouseenter事件与mouseleave事件：
<style>
.div1{
width: 300px;
height: 300px;
border:1px solid red;
}
.div2{
width: 200px;
height: 200px;
background: red;
}
</style>
<body>
<div class="div1">
<div class="div2">
</div>
</div>
<script src="./jquery-1.12.4.js"></script>
<script>
/* hover 由mouseenter和mouseleave组成 */
// $('.div1').hover(function(){
// console.log(1);
// })
/* mouseenter mouseleave ★在进入子元素区域的时候不会触发*/
// $('.div1').mouseenter(function(){
// console.log('mouseenter');
// })
// $('.div1').mouseleave(function(){
// console.log('mouseleave');
// })
/* mouseover和 mouseout 在进入子元素区域的时候也会触发*/
// $('.div1').mouseover(function(){
// console.log('mouseover')
// })
// $('.div1').mouseout(function(){
// console.log('mouseout')
// })
</script>
</body>
jq的链式调用：
<script>
/* jq可以链式调用 */
// $('div').text('我是学生').css('color','red').attr({name:'zhangsan',age:30})
/* 链式调用的原理 jq里面的方法都会return this 把当前调用者return出去 实现链式调用 */
/* end()：结束当前链条中的最近的筛选操作，并将匹配元素集还原为之前的状态 */
// $('ul li').eq(0).css('background','yellow').end().eq(1).css('background','red')
// console.log( $('ul').css('width') ) /* =>340px 字符串 */
// console.log( $('ul').css('height') ) /* =>120px 字符串 */
// console.log( $('ul').width() )/* =>340 数字 */
// console.log( $('ul').height() )/* =>120 数字 */
</script>
鼠标移入和移出：
// $('.div1').hover(function(){
// console.log(1);
// })
/* mouseenter mouseleave ★在进入子元素区域的时候不会触发*/
// $('.div1').mouseenter(function(){
// console.log('mouseenter');
// })
// $('.div1').mouseleave(function(){
// console.log('mouseleave');
// })
/* mouseover和 mouseout 在进入子元素区域的时候也会触发*/
// $('.div1').mouseover(function(){
// console.log('mouseover')
// })
// $('.div1').mouseout(function(){
// console.log('mouseout')
// })
键盘事件：
// $('input[type=text]').keydown(function(){
// alert('我按下了')
// })
/* 释放按键时 */
// $('input[type=password]').keyup(function(){
// alert('鼠标抬起了')
// })
/* 产生可打印的字符时 连续敲击键盘的时候触发 */
// $('input[type=password]').keypress(function(){
// alert('连续敲击键盘')
// })
$(document).keyup(function(e){
/* 敲击回车的时候触发 */
if(e.keyCode==13){
alert('我提交了')
}
})
