JQuery入门及选择器
JQuery概念
JQuery是一个快速的、简洁的JavaScript库。
JQuery封装了JavaScript常用的功能代码,优化了DOM操作、事件处理,动画设计和Ajax交互。
JQuery本质:就是学习调用这些函数(方法)。
JQuery中的顶级对象$
1.$是JQuery的别称,在代码中可以使用JQuery代替,但一般为了方便,通常都直接使用$
2.$是JQuery的顶级对象,相当于原生JavaScript中的window。把元素利用$包装成JQuery对象,就可以调用JQuery的方法
JQuery的优点
1.轻量级
2.跨浏览器兼容,基本兼容了现在主流的浏览器
3.链式编程、隐式迭代
4.对事件、样式、动画支持、大大简化了DOM操作
5.支持插件扩展开发。有着丰富的第三方的插件。例如:树形菜单、日期控件、轮播图等
6.免费、开源
1.基础选择器
$("选择器")
| 名称 | 用法 | 描述 |
| ID选择器 | $("#id") | 获取指定id的元素 |
| 全选选择器 | $("*") | 匹配所有元素 |
| 类选择器 | $(".class") | 获取同一类class的元素 |
| 标签选择器 | $("div") | 获取同一类标签的所有元素 |
| 并集选择器 | $("div,p,li") | 选取多个元素 |
| 交集选择器 | $("li.current") | 交集元素 |

2.层级选择器
常用的两个分为后代选择器和子代选择器
| 名称 | 用法 | 描述 |
| 子代选择器 | $("ul>li") | 使用>号,获取亲儿子层级的元素;注意:并不会获取子孙层级的元素 |
| 后代选择器 | $("ul li") | 使用空格,代表后代选择器,获取ul下的所有li元素,包括子孙等 |

3.属性选择器
属性选择器是制定DOM元素对应属性的一种选择器
| 名称 | 用法 | 描述 |
| 属性名称选择器 | $("A[属性名]") | 包含指定属性的选择器 |
| 属性选择器 | $("A[属性名='值']") | 包含指定属性等于指定值的选择器 |
| 复合属性选择器 | $("A[属性名='值'] []...") | 包含多个属性条件的选择器 |

4.过滤选择器
| 语法 | 用法 | 描述 |
| :first | $("li:first") | 获取第一个li元素 |
| :last | $("li:last") | 获取最后一个li元素 |
| :eq(index) | $("li:eq(2)") | 获取到的li元素中,选择索引号为2的元素,索引号index从0开始 |
| :odd | $("li:odd") | 获取到的li元素中,选择索引号为奇数的元素 |
| :even | $("li:even") | 获取到的li元素中,选择索引号为偶数的元素 |

5.表单过滤选择器
| 名称 | 用法 | 描述 |
| 可用元素选择器 | :enabled | 获得可用元素 |
| 不可用元素选择器 | :disabled | 获得不可用元素 |
| 选中选择器 | :checked | 获得单选/复选框选中的元素 |
| 选中选择器 | :selected | 获取下拉框选中的元素 |
表单过滤器
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
