1 css操作
css(name,value)
css(obj)
css(name)
2 class操作
2.1 addClass(name) 添加类
2.2 removeClass(name) 删除类
2.3 toggleClass(name) 切换类
2.4 hasClass(name) 判断类 (boolean)
3. 三组简单动画
1.show()显示 hide()隐藏 toggle()切换 //不传参数,没有动画效果
2.slideUp()滑出 slideDown()滑入 slideToggle()滑出划入切换 //不传参也有动画效果
3.fadeIn()淡入 fadeOut()淡出 fadeToggle()淡入淡出切换 //不传参也有动画效果
4. 自定义动画
easing linear 匀速
swing 先慢再快再慢
animate(obj, speed, easing, callback)
5. 动画队列
停止当前动画 stop()
stop(参数1,参数2)
参数1: true 清空动画队列 (默认false)
参数2: true 立刻抵达当前动画目标值 (默认false)
6. 节点操作
$(htmlStr) 创建节点
添加节点
append 1. append("123
")
2. append($('123
'))
3. 页面已经存在的元素进行append append($p) 剪切的效果
append 添加到当前元素 子元素的 最后面
prepend 添加到当前元素 子元素的 最前面
before 作为兄弟元素 添加到当前元素 的前面
after 作为兄弟元素 添加到当前元素 的后面
7. html() text() innerHtml innerText
html()
当该方法用于返回内容时,则返回第一个匹配元素的内容(整个html结构),只返回divDOM集合中的第一个div内容
var boxCon = $("div").html();
console.log(boxCon);
当该方法用于设置内容时,则重写所有匹配元素的内容。
$("div").html("hello box
")//所有的div内容都被修改为hello box
text()
当该方法用于返回一个值时,它会返回所有匹配元素的组合的文本内容(会删除 HTML 标记即只返回文本)。
$("div").text("你好")
$("div").text("你好
")
当该方法用于设置内容时,则重写所有匹配元素的内容。(传入什么就渲染什么)
8. empty() 清空内容. 清理门户 (防止内存泄露) remove() 自杀
empty() 清空内容. 清理门户
$("#bigBox").empty()//删除#bigBox所有的元素,
remove() 自杀 //删除被选元素子元素和自身
9. clone()
1. 不传参也会深度复制(即标签中的内容)
2. 传了 true clone(true) 不仅会深度复制, 连方法也会赋值