摘要:window.onload的用法:页面一般都是从上到下的顺序执行的,如果js代码在元素前面,就不会获取到元素,如果js代码放在文档最后就不需要使用window.onload<script> window.onload=function(){ 函数体 }</script>jQuery中有函数 <script> $(document).ready(functio
window.onload的用法:页面一般都是从上到下的顺序执行的,如果js代码在元素前面,就不会获取到元素,如果js代码放在文档最后就不需要使用window.onload
<script>
window.onload=function(){
函数体
}
</script>
jQuery中有函数
<script>
$(document).ready(function(){
函数体;
})
</script>
或者:
<script>
$(function(){
函数体;
})
</script>
jQuery选择器
1.基本选择器
$("#id"/"tag"/".class"/"*所有元素"/"selector")
2.层级选择器
ancestor descendant 根据祖先元素匹配所有的后代元素
parent>child 根据父元素匹配所有的子元素
prev+next 匹配所有紧接在prev元素后的相邻元素
prev~silings 匹配prev之后的所有兄弟元素
3.过滤选择器
4.表单选择器
事件
1.页面载入事件
$(document).ready(function(){函数体;})
$(function(){函数体;})
jQuery(document).ready(function(){函数体;})
jQuery(function(){函数体;})
2.绑定事件
bind(type,[data],fn);
type为一个或者多个类型的字符串,包括:blur/fucous/load/resize/scroll/unload/click/dbclick/mousedown/mouseup/mousemove/mouseover/mouseout/mouseenter/mouseleave/change/select/submit/keydown/keypress/keyup/error
参数data不常用
参数fn是绑定到每个选择元素事件中的处理函数
3.切换事件
hover()使元素在鼠标悬停和鼠标移出的事件之间进行切换,可使用mouseenter和mouseleave进行替换。
hover(over,out)参数over为鼠标移动到元素时触发的函数,out为鼠标移出时触发的函数。
4.移除事件
unblind([type],[fn])其中type为移除事件类型,fn为需要移除的事件处理函数;如果该方法没有参数,则移除所有绑定事件;如果带有参数type,则移除该参数指定的事件类型;如果带有fn,则只移除绑定时指定的函数fn。
常用效果
1.隐藏与显示
JavaScript中的方法:document.getElementById("p").style.display="none"
jquery中的方法:show(speed,[callback]),hide(speed,[callback])
2.淡入与淡出
fadeIn(speed,[callback]),fadeOut(speed,[callback])回调函数为动画完成后可执行的函数
fadeTo(speed,opacity,[callback])参数opacity为指定的不透明度。
3.滑动
slideDown(speed,[callback])
slideUp(speed,[callback])
slideToggle(speed,[callback])该方法实现自动切换
4.动画
animate(params,[速度],[动画插件],[callback])其中params参数要用驼峰式命名法,例如:font-size变为fantSize
stop([clearQuene],[gotoEnd])动画停止
deplay(duration,[queneName])动画延迟
jquery 添加css样式
例:$(this).css('display','none')
特别是要注意jQuery的加载顺序
批改老师:查无此人批改时间:2019-04-11 14:15:36
老师总结:完成的不错。jq有很多方法,记住就可以熟练的使用了。继续加油。