前端

动画

滑动系列
slideDown 向下划入
slideUp 向上划出
slideToggle 切换
slideDown(毫秒数,回调函数)

显示系列
show hide toggle

渐入渐出
fadeIn 渐入
fadeOut 渐出
fadeToggle 切换

stop() 停止之前的动画
事件

绑定事件

// bind
$('button').bind('click',{'a':'bb'},fn); // 事件类型 参数 函数

function fn(e) {    //   e 事件的对象 
    console.log(e);    
    console.log(e.data);   //  传的参数
    // alert(123)

}

$('button').bind('click',fn);

function fn(e) {
    console.log(e);
} 

// 事件

$('button').click({'a': 'b'}, fn) // 参数 函数

function fn(e) {
    console.log(e.data);
}

$('button').click( fn)

function fn(e) {
    console.log(e.data);
}

解除事件

$('button').unbind('click')
常用的事件

click(function(){...}) // 点击事件

focus(function(){...}) // 获取焦点
blur(function(){...}) // 失去焦点

change(function(){...}) //内容发生变化,input(鼠标移出),select等

keyup(function(){...})

mouseover/mouseout
mouseenter/mouseleave = hover(function(){...})
文档的加载

js
window.onload = function () { // 页面 图片 视频 音频 都加载好执行
$('#b1').click(
function () {
$('.mask').show()
}
);
}

// window.onload 只执行一次 多次的划 后面的覆盖前面的

jquery
$(window).ready(function () { // 页面 图片 视频 音频 都加载好执行
$('#b1').click(
function () {
$('.mask').show()
}
);

})
// $(window).ready() 可执行多次 不会覆盖

$(document).ready(function () { // 页面 都加载好执行
$('#b1').click(
function () {
$('.mask').show()
}
);
})
})

// 简写
$(
function () { // 页面 都加载好执行
$('#b1').click(
function () {
$('.mask').show()
}
);

    )

each

$('li').each(function (i,dom) {
console.log(i,dom)
console.log(i,dom.innerText)
})

posted @ 2019-10-17 23:40  熊华  阅读(104)  评论(0编辑  收藏  举报