(本文年代久远,请谨慎阅读)今天学习了JQuery的一些基本用法,包括JQuery选择器和JQuery包装集; 从现在开始,要慎重区分DOM对象和JQuery对象,两种对象的方法不同,属性不同,在使用中要特别注意...JQuery选择器 编写任何javascript程序都需要首先获得对象, jQuery选择器能彻底改变我们平时获取对象的方式, 可以获取几乎任何语意的对象, 比如”拥有title属性并且值中包含test...的元素”, 完成这些工作只需要编写一个jQuery选择器字符串....学习jQuery选择器是学习jQuery最重要的一步....由于该事件在文档就绪后发生,因此把所有其他的 JQUERY事件和函数置于该事件中是非常好的做法。
jQuery的选择器 一、 基本选择器 1....(可以是ID选择器、元素选择器或是类名选择器)组合在一起,两个选择器之间以逗号”,”分隔,只要符合其中的任何一个筛选条件就会被匹配,返回的是一个集合形式的jQuery包装集,利用jQuery索引器可以取得集合中的...示例:(“div,#btn”) //要查询文档中的全部的元素和id属性为btn的元素 5.通配符选择器 二、层次选择器...”#”和”}”等特殊字符的情况。...console.log(b) 以上代码会出现不同的结果,是因为后代选择器和过滤选择器的不同 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。
一、选择器 ? ?...二、选择器的用法 1、.eq(index),.get([index]) 对于一个特定结果集,我们想获取到指定index的jQuery对象 $('div').eq(3); //获取结果集中的第四个jQuery...对象 通过类数组下标的获取方式或者get方法获取指定index的DOM对象,也就是我们说的jQuery对象转DOM对象 $('div')[2] //获取第三个dom对象 $('div').get(2)...如果提供一个选择器,那么只有紧跟着的兄弟元素满足选择器时,才会返回此元素。...11、.is(selector), is(function(index)), is(dom/jqObj) 判断当前匹配的元素集合中的元素,是否为一个选择器,DOM元素,或者jQuery对象,如果这些元素至少一个匹配给定的参数
jQuery选择器 jQuery的基本用法 < script type=“text...常用的效果方法 (selector).hide() – 隐藏被选的元素 (selector).show() – 显示被选的元素 (selector).toggle() – 对被选元素进行隐藏和显示的切换...(selector).slideDown() – 通过调整高度来滑动显示被选元素 (selector).slideToggle() – 对被选元素进行滑动隐藏和滑动显示的切换 (selector).slideUp...(selector).nextAll() – 返回匹配元素集合中每个元素之后的所有同辈元素,由选择器进行筛选(可选)。...(selector).each() 对对象进行迭代,为每个元素执行函数 (selector).toArray() 以数组的形式返回 jQuery 选择器匹配的元素 (selector).text()
1. jQuery选择器的介绍 jquery选择器就是快速选择标签元素,获取标签的,选择规则和css样式一样。...2. jQuery选择器的种类 标签选择器 类选择器 id选择器 层级选择器 属性选择器 示例代码: $('#myId') //选择id为myId的标签 $('.myClass') // 选择class...为myClass的标签 $('li') //选择所有的li标签 $('#ul1 li span') //选择id为ul1标签下的所有li标签下的span标签 $('input[name=first]')...// 选择name属性等于first的input标签 说明: 可以使用length属性来判断标签是否选择成功, 如果length大于0表示选择成功,否则选择失败。...小结 jQuery选择器就是选择标签的 标签选择器是根据标签名来选择标签 类选择器是根据类名来选择标签 id选择器是根据id来选择标签 层级选择器是根据层级关系来选择标签 属性选择器是根据属性名来选择标签
1 $("*") ---------选取所有元素 2 $(this) --------选择当前HTML元素 3 $("p.a") -----选取p元素下class为a
基本选择器 基本选择器是最简单的选择器,可以通过元素id、class和标签名等来直接查找DOM元素。 元素选择器 根据给定元素名匹配元素。如下选择的是所有div元素。... type="button" value="选择 所有的元素." id="btn4"/> 层次选择器 如果想利用DOM元素之间的层次关系来获取特定元素,例如后代元素、子元素、相邻元素和同辈元素等,可以使用层次选择器。...-- 引入jQuery --> <script src=".....<em>选择</em>器 描述 :input 选取所有的、、<em>和</em>元素。 :text 选取所有的单行文本框。 :password 选取所有的密码框。
jQuery库包含以下功能: HTML元素选取 HTML元素操作 CSS操作 HTML事件函数 JavaScript特效和动画 HTML DOM遍历和修改 AJAX Utilities 除此之外,jQuery...jQuery操作思想 jQuery是使用选择器($)选取DOM对象,对其进行赋值、取值、事件绑定等操作,其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象,而数据和界面是在一起的。...jQuery应用场景 jquery侧重样式操作,比如一些H5的动画页面;需要js来操作页面样式的页面。...敲黑板:jQuery的编程思想是首先编写HTML和CSS的页面展示再操作DOM树,而框架是首先考虑页面的功能,再进行前端的展示,编程思想正好相反。...因为jQuery的诸多局限性导致前端工程师的发展受到了很多的限制,只能做一些表面性的工作,并不能实现前后端分离开发。 而近期出现的Vue,它给前端带来了无限的可能和改变。
我们已经使用了带有简单Css选择器的jQuery选取函数:$()。现在是时候深入了解jQuery选择器语法,以及一些提取和扩充选中元素集的方法了。...一、jQuery选择器 在CSS3选择器标淮草案定义的选择器语法中,jQuery支持相当完整的一套子集,同时还添加了一些非标准但很有用的伪类。注意:本节讲述的是 jQuery选择器。...简单选择器可以组合成“组合选择器”,比如 “div.note>p”和“blockquote i”,只要用组合字符做分隔符就行。简单选择器和组合选择器还可以分组成逗号分隔的列表。...使用“:checked”来选取选中的复选框和单选框(jQuery的扩展) :submit 匹配和元素(jQuery...">的子元素 注意:CSS和jQuery选择器语法允许在简单选择器的某些过滤器中使用圆括号,但并不允许使用圆括号来进行更常见的分组。
原生 JS 获取元素方式很多,很杂,而且兼容性情况不一致,因此 jQuery 给我们做了封装,使获取元素统一标准。 1....基础选择器 $("选择器") // 里面选择器直接写 CSS 选择器即可,但是要加引号 ? 2. 层级选择器 层级选择器最常用的两个分别为:后代选择器和子代选择器。 ?...基础选择器和层级选择器案例代码 我是div 我是nav div 我是p <...筛选选择器 筛选选择器,顾名思义就是在所有的选项中选择满足条件的进行筛选选择。常见如下 : ? 4....2.需要得到当前小li 的索引号,就可以显示对应索引号的图片 3.jQuery 得到当前元素索引号 $(this).index() 4.中间对应的图片,可以通过 eq(index) 方法去选择 5.显示元素
——阿列克谢耶维奇 分享一个jquery选择器的小技巧 我们可以通过自定义属性键值选中一个元素 例如如下元素: 阿超 然后我们通过ruben=
选择集转移介绍 选择集转移就是以选择的标签为参照,然后获取转移后的标签 2....选择集转移操作 $('#box').prev(); 表示选择id是box元素的上一个的同级元素 $('#box').prevAll(); 表示选择id是box元素的上面所有的同级元素 $('#box')....next(); 表示选择id是box元素的下一个的同级元素 $('#box').nextAll(); 表示选择id是box元素的下面所有的同级元素 $('#box').parent(); 表示选择id...是box元素的父元素 $('#box').children(); 表示选择id是box元素的所有子元素 $('#box').siblings(); 表示选择id是box元素的其它同级元素 $('#box...") 表示获取指定选择器的元素
1 jQuery 选择器 原生 JS 获取元素方式很多,很杂,而且兼容性情况不一致,因此 jQuery 给我们做了封装,使获取元素统一标准。 1.1....基础选择器 $("选择器") // 里面选择器直接写 CSS 选择器即可,但是要加引号 ? 1.2. 层级选择器 层级选择器最常用的两个分别为:后代选择器和子代选择器。 ?...基础选择器和层级选择器案例代码 我是div 我是nav div 我是p <...筛选选择器 筛选选择器,顾名思义就是在所有的选项中选择满足条件的进行筛选选择。常见如下 : ?...1.4 知识铺垫 jQuery 设置样式 $('div').css('属性', '值') jQuery 里面的排他思想 // 想要多选一的效果,排他思想:当前元素设置样式,其余的兄弟元素清除样式
选择集过滤的介绍 选择集过滤就是在选择标签的集合里面过滤自己需要的标签 2....选择集过滤的操作 has(选择器名称)方法,表示选取包含指定选择器的标签 eq(索引)方法,表示选取指定索引的标签 has方法的示例代码: $(function(){...小结 选择集过滤可以使用has方法和eq方法来完成 jquery给标签设置样式使用css方法
jquery用法思想 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功。...').filter('.myClass'); //选择class等于myClass的div元素 $('div').eq(5); //选择第6个div元素 上面演示如何使用jquery来选择上元素,那么下面继续来演示一下选择集的过滤...DOCTYPE html> <script type="text/javascript" src="<em>jquery</em>/<em>jquery</em>...判断是否<em>选择</em>到了元素 <em>jquery</em>有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到了元素,length等于0,就是没<em>选择</em>到元素,length大于0,就是<em>选择</em>到了元素。
基本选择器(*) 在开发过程中,jQuery对象的定义 var $obj=$("选择的对象"); //$obj为自定义的元素名 id选择器 $("#id"); 选中的结果是该元素的jQuery对象 标签选择器...$("标签名称");jquery对象的集合,如果选择结果只有一个,那么是当前对象 类选择器 $(".类名"); jQuery对象的集合,类名是在css中定义 并集选择器 $("selector1seletor2...(被选择元素不只一个) 属性过滤选择器(*) $(选择器[attributeName^|$|*='']) 在选择器的基础上, 对属性进行选择=代表属性值必须和'指定值'一致; ^=属性以指定值开头;...选择索引最后一个元素; :not(选择器) 选择不包含selector选择器的元素; :even 选择索引为偶数的元素; :odd 选择索引为奇数的元素; 注意: 使用等于和小于进行并集选择器时,等于在前...:contains("value") 选择元素中内容包含指定值的元素(包括div等标签); :empty 选中不包含子元素和内容的元素; :has(选择器) 匹配包含有指定选择器选中的元素的元素; :
依赖库:jquery-XXX.js 语法:$() 正文 5择器 id选择器 $(“#id值”) 样例:$(#span1).css(“color”,”red”); 标签选择器 $(“标签名称”) Class...选择器 $(“.class的值”) 群组选择器 $(“标签名称1,标签名称2”) 包括选择器 $(“标签名称1 标签名称2”) 表单选择器 $(“:input”)全部的Input标签 $(“:text...:image;:File 演示样例: $(“:input”).css(“cursor”,”wait”); 条件限定选择器 基本条件限定 :first :last :lt :gt :odd(奇数...:has(selector)返回值:Array匹配含有选择器所匹配的元素的元素一个用于筛选的选择器演示样例描写叙述:给全部包括 p 元素的 div 元素加入一个 text 类HTML...而此选择符将为每一个父元素匹配一个子元素 演示样例描写叙述:在每一个 ul 中查找第一个 li HTML 代码: John Karl
1、 基本选择器 选择器 描述 结果 示例 #id 根据id获取元素 单个 $(“#myid”)选取id的值为myid的元素 .class 根据class获取元素 集合 $(“.myclass”)选取...,a是b的子元素,b是c的子元素,那么可以说a和b都是c的后代元素 2) nextAll()和siblings的区别在于nextAll是有约束的 3、 过滤选择器 基本过滤 选择器 描述...gt(index)和:lt(index) 所以等于、大于、小于index的元素 :header 选取所有标题元素 集合 选取的是h1、h2等 :focus 选取获取当前焦点的元素 集合 内容过滤...=value] 和上面相反 集合 可见性过滤 选择器 描述 结果 示例 :hidden 选取所有不可见的元素 集合 包含有input中hidden以及display:none等 :visible 选取所有可见的元素...选择器 描述 结果 示例 :input 选取input、textarea以及select和button元素 集合 $(“:input”) :text 选取单行文本框 集合 $(“:text”) :password
jQuery网页脚本语言核心之一 概述: 1. 选择器是jQuery的基础 2. 对事件处理,遍历DOM和Ajax操作都依赖于选择器 3. 可简化代码 什么是jQuery选择器?...简洁的写法 (1) $(选择) 2. 完善的处理机制 (1) 简洁,避免某些错误 类型: 可通过css选择器和过滤选择器两种方式选择元素,每种又有不同的方法来获取元素 1. ...通过 过滤选择呢亲选择元素 (1) 基本过滤选择器 (2) 可见性过滤选择器 详解: 通过css选择器选取元素 jQuery支持大多数css选择器 最常用的有:基本选择器,层次选择器和属性选择器 在jQuery...基本选择器 1. 继承了css选择器的语法和功能 2. 主要由元素标签名,class,id和多个选择器组成 3. 可以实现大多数页面元素的查找 4. ...在层次选择呢亲中,后代选择器和子选择器较为常用,而相邻元素选择器和同辈元素选择器在jQuery中可以用更加简单的方法代替: (1)使用next()房代替prev-next(相邻元素选择器) (2)使用nextAll
jquery选择器允许对html中的元素组合单个元素进行操作,jquery的选择器和css的选择器几乎大同小异,大致分为元素选择器、id选择器和类选择器。...jquery的选择器基于元素的id、类、类型、属性、属性值等查找或选择html元素,基于已经存在的css选择器,另外,jquery也支持自定义选择器。...jquery中所有选择器都是以美元符号开头,即$()。 元素选择器 <!...id选择器 jquery的id选择器通过html元素中的id属性选取指定的元素,页面中的元素id必须是唯一的,所有在选择的时候需要使用#id选择器。 <!...类选择器 类选择器,也就是.class选择器。jquery可以通过指定的class查找元素。 <!
领取专属 10元无门槛券
手把手带您无忧上云