DOM事件节点jq

Posted 2021-03-22 wangzihao147

document.getElementById(id).onclick = function(){code};

window：浏览器打开的窗口

 

 

事件属性：alert(message);警告框；
setInterval(function(){},1000)定时器；
clearInterval()取消定时器；
setTimeout(function(){},1000);
clearTimeout()；取消定时；

confirm(message)确认框；
scrollTo();
window.onload=function(){};加载完执行，
window.history.back();后退；
window.location.href=跳转页面；

　　

波菲那契数列；1 1 2 3 5 8

function fun(n) {
    if (n == 1 || n == 2) {
        return 1
    } else {
        return fun(n - 1) + fun(n - 2)
    }
}

　　

 

html文档中的所有事物都是节点；

整个文档是文档节点

每个 HTML 元素是元素节点

HTML 元素内的文本是文本节点

每个 HTML 属性是属性节点

所有注释是注释节点

 

parentNode:父级节点
childNodes:子级节点集
firstChild:第一个子级节点
lastChild:最后一个子级节点
nextSibling:同级下一个节点
previousSibling:同级上一个节点

　　

 

jq

引入

选择器：同css选择器；

$(‘#id’)；$(‘p’);$(‘[href=”#”]’);$(‘.cla’)

事件

$(‘p’).click(function(){});

jq冲突问题：$其他js可以会使用，释放$ var jq= jQuery.noConflict();

隐藏/显示

$(‘div’).hide();$(‘div’).show();$(‘div’).toggle();

 

淡入淡出

fadeIn(speed,callback);淡入
fadeOut(speed,callback);淡出
fadeToggle(speed,callback);淡入淡出切换；
fadeTo(speed.opacity,callback);渐变为给定的不透明度

　　

滑动

slideDown(speed,callback);向下滑动
slideUp(speed,callback);向上滑动
slideToggle(speed,callback);滑动之间切换

　　

 

动画

animate({params},speed,callback);
可以使用相对值：
$(div).animate({
left:’200px’,
height: ‘+=150px’,
});

　　

队列功能：多个不同的动画会按照队列顺序执行；

stop()用于动画或效果完成前对它们进行停止；