jQuery的常用的选择器 元素创建 动画 三大特征总结:
选择器:
ID选择器 ········$("#id属性值")
标签选择器······· $("标签名字")
类选择器······· $(".类样式名字")
交集选择器······· $("标签.类样式名字")
并集选择器······· $("选择器,选择器,选择器,选择器,...")
索引选择器
索引选择器······· $("选择器:eq(索引的值)")
奇数筛选器······· $("选择器:odd")
偶数选择器······· $("选择器:even")
筛选器 ······· $("选择器:lt(索引)") ----->获取小于这个索引的元素
······· $("选择器:gt(索引)") ----->获取大于这个索引的元素
其他选择器
$("选择器:last") -------> 最后一个
$("选择器:first") -------> 第一个
父子
$(“选择器”).parent();查找父元素
$(“选择器”).children();查找所有子元素
$(“选择器”).children().first();查找第一个子元素
$(“选择器”).children().last();查找最后一个子元素
$(“选择器”).children().eq(下标);查找第n个子元素
$(“选择器”).find(“选择器”);查找所有后代符合选择器条件的元素
兄弟
$(“选择器”).next();下一个兄弟元素
$(“选择器”).nextAll();之后所有兄弟元素
$(“选择器”).prev ();上一个兄弟元素
$(“选择器”).prevAll();之前所有兄弟元素
$(“选择器”).siblings(“选择器”);除自己所有兄弟元素
方法:
.val() 操作表单元素的value值,可获取也可以设置
.text() 操作元素中间的文本内容,相当于innerText
.html() 操作元素中html代码及内容,相当于innerHtml
.css() 操作元素的样式
.addClass 添加类
.removeClass 移除类
.hasClass() 判断元素是否应用了某个类
.index() 元素的索引 下标
var index =$(“选择器”).index(“需要查找的元素”);
.trigger 模拟触发
动画方法
.show() 显示
.hide() 隐藏
.stop() 停止动画
animate() 动画的方法
slideUp() 滑入
slideDown() 滑出
slideToggle() 切换滑入/滑出
fadeIn() 淡入
fadeOut() 淡出
fadeToggle() 切换淡入淡出
fadeTo(时间,透明度的值)
元素创建:
$("html的代码")
元素的添加
父级元素.append(子级元素)
子级元素.appendTo(父级元素) //插入到结尾
父级元素.prepend(子级元素)
子级元素.prependTo(父级元素) //插入到开头
clone() 克隆元素
父级元素2.append($("父级元素1>子级元素")); //相当于剪切
.after 例:$("#div").after($(<span></span>)) //把元素添加到div后面 ,成为div的下一个兄弟元素
.before 例: $("#div").before($(<span></span>)) //把元素添加到div前面 ,成为div的上一个兄弟元素
元素移除:
.html("") 例:$("div").html(""); //清空div中内容 可以看做移除所有子元素
.empty() 例:$("div").empty(); //清空所有子元素
.remove() 例:$("div").remove() ; //等同自杀 ‘获取的谁干掉谁’
jQuery的三大特征:
1、被jQuery封装的DOM都返回一个类数组对象,给这个类数组对象调用一次API,就相当于给所有的DOM都调用一次API。
2、一个函数两用,给值就是修改,不给值就获取
3、几乎调用每个API都返回当前操作的对象。可以用于链式操作。
评论