JQurey学习
Posted qqwhsj
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JQurey学习相关的知识,希望对你有一定的参考价值。
JQurey是javascript的一个类库,简化了JavaScript编程(因为JavaScript真的手感很shit)
一、JQuery的功能
- html 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
二、function
1.document方法的两种写法,该方法意义在于直接调用与JS中的onload类似
$(document).ready(function(){ alert(1) }); $(function(){ alert(1) });
onload与function的区别
onload:后于function执行,且只能存在一个,多个存在时,后者会直接覆盖前者。
function:可以存在多个,执行顺序按照代码顺序。
三、JQuery的选择器
分类与CSS中类似
id选择器:使用#+选择器名 $("#selector").function(){}
类选择器:使用.+选择器名 $(".selector").function(){}
属性选择器:使用[flied=value] $("[type="button"]").function(){}
由于命名原因,详情见:http://www.w3school.com.cn/jquery/jquery_ref_selectors.asp
四、JQuery对元素的操作
text():获得选择元素的文本内容
val():获得选择元素的value值
html():获取选择元素内部的内容,以html方式呈现
attr():获得选择元素的属性值(内涵属性名),设置选择元素的属性(内涵两个元素,前者为属性名,后者为属性值)
五、JQuery的效果
显示/隐藏:使用show()与hide()完成该操作,也可以使用toggle来完成(即两者结合的操作,当隐藏是会执行show,实现是会执行hide),可设置时间控制
淡入淡出:使用fateIn()和fateOut()完成操作,也可使用fatetoggle完成,可设置时间
滑入划出:使用slideDown()和slideUp()完成操作,可以使用slidetoggle完成,可设置时间
保持透明度:fateTo(),状态与显示相同,可设置时间。
滑动:animate(),内部{}设置滑动的方向,还可以设置width,height,以及opacity透明度等,不过需要有position属性(relation,fixed,absolute)。
停止动画:stop方式停止动画
六、HTML操作
添加:append,preend分别用于在文字属性开头与结尾添加; before和after分别用于在非文字前后添加。
删除:remove,删除选定元素 empty,删除选定元素内部的子元素。
添加删除CSS类:addClass:不过只能添加类选择器,removeClass:删除选择器 toggle:存在则添加,不存在则删除
添加CSS属性:css({属性1:属性值1,属性2:属性值2})或则 css(属性名,属性值)
宽高:width和height:不包括内边距,外边距 innerwidth和innerheight:不包括外边距 outerwidth和outerheight:包括内外边距
以上是关于JQurey学习的主要内容,如果未能解决你的问题,请参考以下文章