JQuery学习
JQuery javascript Query
封装了javascript
使用 $(); 等于javascript中的 window.onload=function(){}
$("#标签id")//表示按id查询标签对象
查询出来的对象名以$开始(习惯)
JQuery对象的本质是什么
是Dom对象的集合
JQuery对象不能使用Dom对象的方法,反之亦然
arrt()与prop()方法
arrt 可以设置和获取属性的值,不推荐操作checked、readOnly、selected、disabled等等
prop 可以设置和获取属性的值,只推荐操作checked、readonly、selected、disabled等等
DOM的增删改
appendTo() ? a.appendTo(b) &emsp 把a元素插入b元素的末尾,成为最后一个子元素(a就去了b那里去了)
prependTo()? a.prependTo(b)&emsp 将a元素插入b元素的开头,成为第一个子元素 prependTo(括号内可以写标签选择器)例如prependTO($("div"))
$("标签"):创建一个标签对象
外部插入
insertAfter() &enspa; a.insertAfter(b) 得到b a(标签顺序)
insertBefore() ? a.insertBefore(b) 得到a b(标签顺序)
替换
replaceWith()&enspa; a.replace(b) 标签b替换标签a
replaceAll()&enspa; a.replaceAll(b)标签a替换掉所有的标签b
删除
remove() &enspa; a.remove() 删除标签a
empty() &enspa; a.empty() 删除标签a的内容
动态添加删除表单
return false 可以阻止标签的默认行为
例如a标签点击会跳转 返回false 的话就不会跳转
css样式操作
addClass() 添加css样式 JQuey对象.addClass("css样式1 css样式二");//addClass() - 向被选元素添加一个或多个类
removeClass() 添加css样式 JQuey对象.removeClass("css样式1 css样式二"); //removeClass() - 从被选元素删除一个或多个类
toggleClass() Quey对象.toggleClass("css样式1 css样式二");//toggleClass() - 对被选元素进行添加/删除类的切换操作 有就删除,没有就添加
//offset() - 返回第一个匹配元素相对于文档的位置。
设置位置:
JQuey对象.offset({
top:100,
left:20
});
JQuery动画
show()?将隐藏的元素显示
hide()?将可见的元素隐藏。
toggle()?可见就隐藏,不可见就显示。
以上的方法都可以添加参数: 毫秒数 和 方法
动画的执行时长 以毫秒为单位
动画回调方法:执行完之后会自动调用参数内的方法
淡入淡出动画fadeln()
fadeIn淡入(慢慢可见)
fadeOut()淡出(慢慢消失)
fadeTo() 在指定时长内慢慢的将透明度修改到指定的值。
fadeToggle()淡入/淡出切换