查找所有复选框: (":checkbox") (:submit) 匹配所有提交按钮 查找所有提交按钮: (":submit") (:image) 匹配所有图像域 匹配所有图像域: (":image...查找所有重置按钮: (":reset") (:button) 匹配所有按钮 查找所有按钮: (":button") (:file) 匹配所有文件域 查找所有文件域: (":file") 表单属性过滤器...的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取,设置和移除操作。...比如prop()、removeProp() 类样式操作:是指对DOM属性className进行添加,移除操作。...#%&*])+ 总结: 1.选择器重点讲了好几个,今天是表单选择器; 2.掌握如何针对某个选择器进行操作,规律:三个字总结:找 事 匿 3.jQuery链式操作 2.6 作业 使用jQuery+正则表达式
4.当我们每次点击小的复选框按钮,就来判断: 5.如果小复选框被选中的个数等于3 就应该把全选按钮选上,否则全选按钮不选。 6....遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。 如果想要给同一类元素做不同操作,就需要用到遍历。 语法1 ? ...获取距离带有定位父级位置(偏移) position 如果没有带有定位的父级,则以文档为准 // 这个方法只能获取不能设置偏移 console.log(...案例:带有动画的返回顶部 1.核心原理: 使用animate动画返回顶部。...类, 兄弟移除current类。
JQUERY选择器包括以下几种: 1、基础选择器 2、层次选择器 3、基本过滤器 4、内容过滤器 5、可见性过滤器 6、属性过滤器 7、子元素过滤器 8、表单选择器 9、表单过滤器 下面列出几种重要的选择器...: 基础选择器 $("#Id") 选择ID为divId的元素(根据元素Id选择) $("element") 选择所有元素(根据元素的名称选择) $(".class") 选择所用CSS类为bgRed的元素...表单过滤器 $("input:enabled")匹配所有可用元素 $("input:disabled")匹配所有不可用元素 $("input:checked")匹配所有选中的被选中元素(复选框、单选框等...执行$("p").parent()之后结果为:[ HelloHello] $("p").parent(".selected")查找段落的父元素中每个类名为...).parent(".selected")之后结果为:[ Hello Again ] 其他 使用is()方法查找段落的父元素中每个类名为
因为checked 是复选框的固有属性,此时我们需要利用prop()方法获取和设置该属性。 把全选按钮状态赋值给3小复选框就可以了。 当我们每次点击小的复选框按钮,就来判断。...遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。 如果想要给同一类元素做不同操作,就需要用到遍历。...: 如果是选中状态,则当前商品添加背景,否则移除背景 这个背景,可以通过类名修改,添加类和删除类 代码实现下文。...获取距离带有定位父级位置(偏移) position 如果没有带有定位的父级,则以文档为准 // 这个方法只能获取不能设置偏移 console.log(...案例:带有动画的返回顶部 核心原理: 使用animate动画返回顶部。
jQuery的选择器 一、 基本选择器 1....在一个页面中,一个元素可以有多个CSS类,一个CSS类又可以匹配多个元素,如果有元素中有一个匹配类的名称就可以被类选择器选取到。...简单地说类名选择器就是以元素具有的CSS类名称查找匹配的元素。...)组合在一起,两个选择器之间以逗号”,”分隔,只要符合其中的任何一个筛选条件就会被匹配,返回的是一个集合形式的jQuery包装集,利用jQuery索引器可以取得集合中的jQuery对象。...简单过滤器是指以冒号开头,通常用于实现简单过滤效果的过滤器 :first 说明:匹配找到的第一个元素,它是与选择器结合使用的
我们已经使用了带有简单Css选择器的jQuery选取函数:$()。现在是时候深入了解jQuery选择器语法,以及一些提取和扩充选中元素集的方法了。...一、jQuery选择器 在CSS3选择器标淮草案定义的选择器语法中,jQuery支持相当完整的一套子集,同时还添加了一些非标准但很有用的伪类。注意:本节讲述的是 jQuery选择器。...jQuery选择过滤器 过滤器 含义 #id 匹配id属性为id的元素。...checkbox”>元素( jQuery的扩展),当显式带有input标签前缀”input:checkbox”时,该过滤器更高效 :checked 匹配选中的input元素 :contains(...使用“:checked”来选取选中的复选框和单选框(jQuery的扩展) :submit 匹配和元素(jQuery
JQuery过滤器 经过一晚上的查找整理,终于整理出一套应该算最全面的JQuery选择过滤器的方法了。所有代码均经过测试。...+.button11"); 4.获取id为text11元素后面的所有class为button11的元素 var button11_query=$("#text11~.button11"); 3.基本过滤器...内容过滤器 Content Filters 1.查找所有html内容含有"你好世界!"的h1元素 var h1_query=$("h1:contains('你好世界!')")...input"); 2.查找所有文本框元素 var text_query=$(":text"); 3.查找所有密码框元素 var password_query=$(":password"); 4.查找所有复选框...input_query=$("input:enabled"); 2.查找所有不可用的input元素 var input_query=$("input:disabled"); 3.查找所有选中的单选复选框
多行字符串 事件指令 v-on 属性指令 v-bind 案例 - 动态修改文本样式 表单指令 v-model 路飞项目 ''' 1. vue 框架 前台html+css+js框架,是不同于 js 与 jquery...实例成员 - 过滤器 filters 1) 过滤器本身就是数据处理的函数,可以将插值表达式中的数据作为参数进行处理,得到的函数返回值就是处理后的结果 2) 过滤器使用语法 {{ ...变量 | 过滤器(......变量) }} 3) 过滤器在实例中用 filters 实例成员提供 类名是否起作用--> 点击切换类 <...,v-model 绑定的变量为布尔类型变量 5) 多复选框,v-model 绑定的变量值是一个列表(数组),存放复选框选项值(谁被选中就存放了谁) 6) 单选框,v-model 绑定的变量值是某一个选项的值
jQuery 1.jQuery介绍 JS中支持使用 $ 这个标识符 引入:我们以前使用DOM对象来改变或者获取相关属性的value值,DOM对象的方法都特别的长,不容易记住, 而且代码的观赏性较差,因此就出现了一种新的技术...jQuery:是一款跨主流浏览器的 JavaScript 库,封装了 JavaScript 相关方法调用,简化 JavaScript 对 HTML DOM 操作 jQuery是一个Java的工具类,库是存放东西的...$("#id,.class,标签名") jQuery基础知识总结 10.表单选择器 表单相关元素选择器是指文本框、单选框、复选框、下拉列表等元素的选择方式。该方法无论是否存在表单,均可做出相应选择。...过滤器也是一个字符串,用来筛选dom对象。 过滤器不能单独使用,必须和选择器一起使用。...代表的是表单中的type属性 选择可用的文本框 $(":text:enabled") var obj=(":text:enabled"); 选择不可用文本框 $(":text:disabled") 复选框选中的元素
jQuery 元素操作主要讲的是用jQuery方法,操作标签的遍历、创建、添加、删除等操作。 一、 遍历元素 jQuery 隐式迭代是对同一类元素做了同样的操作。...如果想要给同一类元素做不同操作,就需要用到遍历。 语法1 ? 注意:此方法用于遍历 jQuery 对象中的每一项,回调函数中元素为 DOM 对象,想要使用 jQuery 方法需要转换。...注意:此方法用于遍历 jQuery 对象中的每一项,回调函数中元素为 DOM 对象,想要使用 jQuery 方法需要转换。...: 如果是选中状态,则当前商品添加背景,否则移除背景 4.这个背景,可以通过类名修改,添加类和删除类 $(".checkall").change(function () { //... // 如果小复选框选中的个数等于所有小复选框个数,则选中全选按钮 否则不选中 // .j-checkbox:checked 选中的复选框 if ($(
val(); $( this ).children( "input:last-child" ).val(); 通过>选择器,$(“.items>input:first”) 在这里转一篇《jQuery...类型的兄弟节点在该F元素之前(E,F紧挨着); E~F:匹配前面是任何兄弟节点E的所有元素F(E,F不必紧挨着); E:has(F):匹配标签名为E,至少有一个标签名为F的后代节点的所有元素E; E.C:匹配带有类名...C等效于*.C; E#I:匹配id为I的所有元素E,#I等效于*#I; E[A]:匹配带有属性A的所有元素E; E[A=V]:匹配所有属性A的值为V的元素E; E[A^=V]:匹配所有元素E,且A的属性值是...V开头的; E[A 4.利用jQuery自定义的选择器进行选择: :button:选择任何按钮类型的元素,包括input[type=submit]等等; :checkbox:选择复选框元素; :file...:选择已选中的选项元素; :visible:选择可见元素; :enable:选择界面上已经可以使用的表单元素; :disabled:选择界面上被禁用的表单元素; :checked:选择已选中的复选框或单选按钮
上周我们聊了一下jQuery的基础部分,这周我们把jQuery的高级部分学习一下吧!同时也预祝各位小伙伴新年快乐!...1、$.fn.extend(object) 增强通过Jquery获取的对象的功能,属于对象级别的插件,例如:$("#id") 我们用一个案例来展示一下插件的使用。如下案例所示: //使用jQuery插件 给jq对象添加2个方法 check()选中所有复选框,uncheck()取消选中所有复选框 //1.定义jQuery的对象插件...所有的jq对象都可以调用该方法 uncheck:function () { //让复选框不选中 this.prop...2、$.extend(object) 增强JQuery对象自身的功能,属于全局级别的插件,例如:$/jQuery ----
引用 jquery/2.1.4/jquery.min.js"> 文档就绪...,推荐使用$("input:text")效率更高,下同 $(":password") //所有密码框 $(":radio") //所有单选按钮 $(":checkbox") //所有复选框...() - 向被选元素添加一个或多个css类 removeClass() - 从被选元素删除一个或多个css类 toggleClass() - 对被选元素进行添加/删除类的切换操作 css() - 设置或返回样式属性...nextUntil() - 两个参数之间的所有同胞元素 prev() - 前面的同胞元素 prevAll() prevUntil() 遍历- 过滤 first() last() eq() - 返回被选元素中带有指定索引号的元素...(索引号从 0 开始) filter() - 选取匹配的元素,返回带有类名 "url" 的所有 元素:$("p").filter(".url"); not() - 选取不匹配的元素
jQuery 选择器允许对 HTML 元素组或单个元素进行操作。 jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"(或选择)HTML 元素。...jQuery 中所有选择器都以美元符号开头:$()。...使用jquery请先引入 jquery.com/jquery-3.1.1.min.js"> 元素选择器 $(this)...$("[href='#']") //选取所有带有 href 值等于 "#" 的元素。 $("[href!='#']") //选取所有带有 href 值不等于 "#" 的元素。...返回元素集合 表单对象属性过滤选择器(返回元素集合) :enabled //选取所有可用元素 :disabled //选取所有不可用元素 :checked //选取所有被选中的元素(单选框,复选框
目录 选择器基本操作 1、事件绑定 2、入口函数 3、样式控制 一、基本选择器 1、标签选择器 2、id选择器 3、类选择器 4、并集选择器 二、层级选择器 1、后代选择器 2、子选择器 三、属性选择器...:在js中定义入口函数的window.onload方法和$(function)方法是有区别的, 具体如下: window.onload只能定义一次,如果定义多次,后面的会将前面的覆盖掉 $(function...{ $("body > div").css("backgroundColor","red"); }); 在这里需要注意的是:这两个选择器看上去似乎没有什么区别,但是我们在使用时就会发现其实是有区别的...// 利用 jQuery 对象的 length 属性获取复选框选中的个数" id="b3" $("#b3").click(function () { var lengths = $("input...对象的 length 属性获取复选框选中的个数" id="b3"/> jQuery 对象的 length 属性获取下拉框选中的个数
> Web技术 jquery...-1.12.4.js"> // 设置总的复选框对子复选框的影响 $(".th input").click(function () {...1、子类复选框的集合在 prop 和 click 中会自动遍历操作。...2、var actualLength = $(".tb :checked").length; 中 .tb 和 :checked 中间有空格,表示的是 类 tb 下面的子元素集合中带有 checked 的元素...,而没有空格表示,设置了类 tb 的所有元素集合中带有 checked 的元素。
二.jQuery高级选择器 针对上次课有点复杂的选择器,或之前没有接触过的选择器。...同样,在jQuery里面,我们要操作页面对象还是需要找对象,找页面对象,就是通过各类的选择器来找,简化我们的业务代码量。...查找所有文本框: $(":text") :password 匹配所有密码框 查找所有密码框: $(":password") :radio 匹配所有单选按钮 查找所有单选按钮 :checkbox 匹配所有复选框...查找所有复选框: $(":checkbox") :submit 匹配所有提交按钮 查找所有提交按钮: $(":submit") :image 匹配所有图像域 匹配所有图像域: $(":image"...匹配所有重置按钮 查找所有重置按钮: $(":reset") :button 匹配所有按钮 查找所有按钮: $(":button") :file 匹配所有文件域 查找所有文件域: $(":file") 表单属性过滤器
.first() .last() .eq(0) 3.2 基本选择器 1.id选择器 $("#id名") 2.类选择器 $(".类选择器名")来访问相应的使用类样式的元素 3....html()->innerHTML,会把下面的带有html标签的格式给原封不动的输出。...password) 匹配所有密码框 查找所有密码框: $(":password") $(:radio) 匹配所有单选按钮 查找所有单选按钮 $(:checkbox) 匹配所有复选框...查找所有复选框: $(":checkbox") $(:submit) 匹配所有提交按钮 查找所有提交按钮: $(":submit") $(:image...button) 匹配所有按钮 查找所有按钮: $(":button") $(:file) 匹配所有文件域 查找所有文件域: $(":file") 表单属性过滤器
jQuery 选择器基于元素的 id、类、类型、属性、属性值等”查找”(或选择)HTML 元素。...类选择器可以通过指定的 class 查找元素。...类( 对 CSS 元素进行操作 ):jQuery 获取并设置 CSS 类 | 菜鸟教程 jQuery 的 css() 方法( 设置或返回被选元素的一个或多个样式属性):jQuery css() 方法...过滤元素并移除 实例解析 jQuery Get 和 设置 CSS 类 jQuery addClass() 不同元素添加 class 属性 jQuery addClass() – 多个类 使用 addClass...() 方法添加多个类 jQuery removeClass() 移除指定元素的类 jQuery toggleClass() 在选取的元素切换(添加/删除)类 实例解析 jQuery css() 方法
什么是jQuery 在使用jQuery之前,我们必须先了解什么是jQuery,它能够干什么(不然我们为啥要用它)。 jQuery是一个非常流行的快速、小巧、功能强大的开源JavaScript库。...前者是jQuery库的源代码版本,它带有注释信息,建议你在开发环境中使用该文件,以便于调试或阅读源代码。...$(".test"); // 选择所有带有CSS类名"test"的元素 $("[name=books]"); // 选择所有name属性为"books"的元素 :针对input元素 // jQuery...CSS类名"foo"和"bar"的父元素 $("#uid").prev(); // 选取id为uid的元素之前紧邻的同辈元素 $("#uid").next(); // 选取id为uid的元素之后紧邻的同辈元素...; // 获取第一个匹配元素的checked属性值 $("selector").prop("checked", true); // 设置所有匹配元素的checked属性值为true(意即选中所有匹配的复选框或单选框
领取专属 10元无门槛券
手把手带您无忧上云