jQuery 核心:选取元素
来源:互联网 发布:势不可挡网络剧百度云 编辑:程序博客网 时间:2024/06/04 19:26
在JS原生DOM中,我们想要对DOM元素进行操作,首先得获取到对应的元素(getElementById()、getElementsByTagName()等),然后再对这些元素进行操作。
同样的,jQuery也需要先选取所需的DOM元素,然后再针对这些元素进行操作。我们先来看看jQuery如何获取所需的元素。
在jQuery中,我们一般通过一个字符串来标识匹配的元素
$("#uid"); // 选取id属性为"uid"的单个元素$("p"); // 选取所有的p元素$(".test"); // 选择所有带有CSS类名"test"的元素$("[name=books]"); // 选择所有name属性为"books"的元素是否感觉这和CSS选择器非常相似?是的,jQuery获取元素就是通过类似于CSS选择器的字符串来匹配对应的元素,我们一般将其称作jQuery选择器(selector)。几乎所有的CSS选择器都可以当做jQuery选择器来使用,只要CSS选择器对哪些元素生效,对应的jQuery选择器就可以选取到哪些元素.
jQuery选择器也支持多个选择器任意组合使用。
// 多个选择器以空格或指定符号隔开,将匹配与前者具有指定关系的最后一个选择器所表示的元素$("#uid span"); // 选择id为"uid"的元素的所有后代span元素$("p > span"); // 选择p元素的所有子代span元素$("div + p"); // 选择div元素后面紧邻的同辈p元素$("div p span"); // 选择div元素的所有后代p元素的后代span元素// 多个选择器之间没有空格,将匹配同时满足这些选择器条件的元素$("p#uid"); // 选择id属性为"uid"的p元素$("div.foo"); // 选择所有带有CSS类名"foo"的div元素$(".foo.bar"); // 选择所有同时带有CSS类名"foo"和"bar"的元素$("input[name=books][id]"); // 选择所有name属性为"books"并且具备id属性的元素jQuery的选择器较多,请直接参考jQuery选择器一览表。
jQuery为我们提供了一系列的文档筛选方法,方便我们快速地选取我们所需的元素
// 以下方法都返回一个新的jQuery对象,他们包含筛选到的元素$("ul li").eq(1); // 选取ul li中匹配的索引顺序为1的元素(也就是第2个li元素)$("ul li").first(); // 选取ul li中匹配的第一个元素$("ul li").last(); // 选取ul li中匹配的最后一个元素$("ul li").slice(1, 4); // 选取第2 ~ 4个元素$("ul li").filter(":even"); // 选取ul li中所有奇数顺序的元素$("div").find("p"); // 选取所有div元素的所有后代p元素$("div").children(); // 选取所有div元素的所有子代元素$("div").children("p"); // 选取所有div元素的所有子代p元素$("span").parent(); // 选取所有span元素的父元素$("span").parent(".foo.bar"); // 选取所有span元素的带有CSS类名"foo"和"bar"的父元素$("#uid").prev(); // 选取id为uid的元素之前紧邻的同辈元素$("#uid").next(); // 选取id为uid的元素之后紧邻的同辈元素本人整理转载, 为以后方便学习! 刚接触Jquery 多多学习。
0 0
- jQuery 核心:选取元素
- jQuery 选取元素
- jquery slibings选取同级其他元素
- Jquery元素选取及取值
- jquery选取自定义属性所在的元素
- jquery选取表单元素的方法
- jQuery核心篇-jQuery()匹配元素
- jQuery核心篇-jQuery()创建元素
- JS/jQuery根据name来选取元素--测试过,可用
- jQuery is not must for us--元素选取
- JQuery选取非本身的同类名元素
- Jquery如何选取元素及其所有子元素?jquery选择器大全
- 要选取jquery每一个父元素下的某个子元素
- jQuery 核心函数:jQuery(html,[ownerDocument])动态创建DOM元素
- DOM-选取文档元素
- 通过class选取元素
- jQuery学习笔记之选取选定复选框的同行某列元素
- jquery 选取方法 笔记
- 最大字段和问题
- 函数指针
- 解决ubuntu14.04下samba共享目录share点开弹出没有权限访问的问题
- 如何打造自己的coreseek/sphinx分词词库
- servlet简介
- jQuery 核心:选取元素
- 弱鸡的博客
- CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout+ViewPager滑动效果,以及代码处理是否推动效果
- 《数据挖掘的数据集资源》
- Redis系列-存储篇list主要操作函数小结
- android ListView向上滑动隐藏标题,下拉显示标题栏
- codeforces - 257c View Angle 【数学】
- Android显示一个多选项对话框
- bzoj 3758: 数数 分块打表