2 元素操作 2.1 jQuery对象 jQuery对象：是对DOM对象的一层包装。 作用：是通过自身提供的一系列快捷功能来简化DOM操作的复杂度，提高程序的开发效率。...n个子元素。...计数从最后一个元素开始到第一个 :nth-of-type(index/even/odd/公式)) 选择同属于一个父元素之下，并且标签名相同的子元素中的第n个子元素 :first-of-type 选择所有相同的元素名称的第一个子元素.../odd/公式) 选择所有它们的父级元素的第n个子元素，计数从最后一个元素到第一个 带有“of-type” 与未带有“of-type”项的选择器有一定的区别。...设置焦点图的外边框的宽度以及超出隐藏，限定其只能显示一张图片。 切换到下一张时，只需要修改焦点图外层样式中的left值，就可以将焦点图整体向左移动，从而显示第2张图片。
(n) $(“p:nth-last-child(2)”) 属于其父元素的第二个子元素的所有 元素，从最后一个子元素开始计数 :nth-of-type(n) $(“p:nth-of-type(2)...:nth-child()选择同父代的第n个子代元素。 :nth-last-child()选择同父代的倒数第n个子代元素。 :nth-last-of-type()选择同父代的倒数第n个子代元素。...:nth-of-type()选择同父代的第n个子代元素。 :only-child选择只有一个子代的元素。 :only-of-type()选择所有没有同名元素的兄弟元素。...特效效果 ：jQuery 效果 – 隐藏和显示 | 菜鸟教程 – 隐藏和显示 – 淡入淡出 – 滑动 – 动画 – 停止动画 – Callback 方法 – 链(Chaining) jQuery 效果方法...实例解析 jQuery 隐藏/显示 jQuery hide() 演示 jQuery hide() 方法。
列举常见的五种选择器，并简单描述其作用 通过选择器，获得jQuery对象 学会给标签绑定事件 可以实现显示或隐藏标签。...固定字符串：slow, normal, or fast 参数2fn，显示成功之后回调函数。 hide() 隐藏 toggle() 切换 1.2.3.2 滑动 通过改变元素 高度 显示或隐藏 ?...slideDown() 显示，高度变大。 slideUp() 隐藏，高度变小。 slideToggle() 切换 1.2.3.3 淡入淡出 通过改变元素 透明度 显示或隐藏 ?...min 最小值 max 最大值 range [min,max] 值范围 equalTo jQuery表达式 两个值相同 remote url路径 ajax校验 9.3 检验方式：js 代码方式...jQuery基础入门2案例 第11章 模拟用户分组 11.1 案例介绍 使用jQuery模拟用户分组，要求如下： 1.页面加载不显示所有分组的列表项。 2.点击分组名称，显示当前分组列表。
:nth-child(index) 第 index 个子元素 语法: $('li:nth-child(2)')； 奇数个: $('li:nth-child(odd)')； 偶数个: $('li:nth-child...attr() 一般只用于操作元素的 HTML 字面属性，如 src、href、name.. val() 操作的是HTML 元素对应的 JS 对象的 value 属性 prop() 操作的是 HTML 元素对应的...JQuery 中的函数第三部分：动画函数 — 隐藏和显示动画 隐藏和显示函数通过使用定时器修改目标元素的 width / height / opcaity 三个样式的值来实现动画 (1). $(..)....[index] 获取类数组中封装的第 index 个 DOM 对象 (3). $(..).get(index) 获取类数组中封装的第 index 个 DOM 对象 (4). $(..).each(...JQuery 对象插件函数 JQuery 对象插件函数就是为所有的 jQuery 对象添加的公共函数，用于操作当前选定的 DOM 元素 声明方式：JQuery.fn.max = function( ){
jQuery对象" class="item">DOM对象和jQuery对象 jQuery选择器大全" class="item-selected...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。...表单对象属性过滤选择器 ——6.1 :enabled和:disabled（取可用或不可用元素） :enabled和:diabled的匹配范围包括input, select, textarea。
contains(str)匹配集合中包含str这个变量文本的元素集合，返回匹配元素集合 end()用于返回到调用find() 或 parents() 函数（或者其它遍历函数）之前的 jQuery 对象...Effects 方法说明 show( ) 显示隐藏的匹配元素。...这个动画效果只调整元素的高度，可以使匹配的元素以"滑动"的方式隐藏或显示。...子元素过滤选择器 $("ul li:nth-child(2)"), $("ul li:nth-child(odd)"), 匹配父元素的第n个子元素 $("ul li:nth-child(3n + 1)...") $("div span:first-child")匹配父元素的第1个子元素 $("div span:last-child") 匹配父元素的最后1个子元素 $("div button:only-child
jQuery对象" class="item">DOM对象和jQuery对象 jQuery选择器大全" class="item-selected...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素 ...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。...表单对象属性过滤选择器 ——6.1 :enabled和:disabled（取可用或不可用元素） :enabled和:diabled的匹配范围包括input, select, textarea。 ?
终于到了js框架的学习部分了，这部分内容主要讲jQuery，也是非常重要的内容。 jQuery应用入门 jQuery是一个JavaScript库，极大的简化了JavaScript编程。...： 不分元素类型的 选择器 说明 :first-child 选择父元素的第一个子元素 :last-child 选择父元素的随后一个子元素 :nth-child(n) 选择父元素下的第n个或奇偶元素,n的值为...选择同元素类型的随后一个子元素 :nth-of-type 选择同元素类型的第n个或奇偶元素,n的值为"整数或odd或even" :only-of-type 匹配父元素中特定类型的唯一子元素(该父元素可以有多个子元素...元素的显示与隐藏 使用hide()方法 使用hide()方法可以隐藏被选元素 $(document).ready(function () { $(".ex .hide...元素的淡入与淡出 使用hide()与show()方法 show和hide方法可以接受参数控制隐藏的过程.: show(speed,callback) speed参数规定显示或隐藏的速度: - slow
前者是jQuery库的源代码版本，它带有注释信息，建议你在开发环境中使用该文件，以便于调试或阅读源代码。...class="foo bar">Hello CodePlayer'); // 包含一个临时的div元素，其内嵌一个子节点p元素 六：元素的筛选 // 以下方法都返回一个新的jQuery...对象，他们包含筛选到的元素 $("ul li").eq(1); // 选取ul li中匹配的索引顺序为1的元素(也就是第2个li元素) $("ul li").first(); // 选取ul li中匹配的第一个元素...$("selector").toggle(); // 切换显示/隐藏元素(如果显示就隐藏，隐藏就显示)，其用法与show()类似 /* 下面的slide*、fade*系列方法与上面的show()、hide...").slideUp(); // 隐藏显示的元素，带有向上滑动的过渡动画效果 $("selector").slideToggle(); // 切换显示/隐藏的元素，带有向上/下滑动的过渡动画效果 $("
Effects 方法说明 show() 显示隐藏的匹配元素。...show(speed, [callback]) 以优雅的动画显示所有匹配的元素，并在显示完成后可选地触发一个回调函数。 hide() 隐藏所有的匹配元素。...slice(start, [end]) 从匹配元素集合中取得一个子集，和内建的数组的slice方法相同。 add(expr) 把与表达式匹配的元素添加到jQuery对象中。...$(”ul li: nth - child(2)”), $(”ul li: nth - child(odd)”), 匹配父元素的第n个子元素 $(”ul li: nth - child(3n + 1)...”) $(”div span: first - child”) 匹配父元素的第1个子元素 $(”div span: last - child”) 匹配父元素的最后1个子元素 $(”div button
"开始，并且class="item"的a标签隐藏，那么jQuery事件大全" class="item">jQuery事件大全会被隐藏 <script type...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。...表单对象属性过滤选择器 ——6.1 :enabled和:disabled（取可用或不可用元素） :enabled和:diabled的匹配范围包括input, select, textarea。
Element 显示时 :hidden //当 Element 隐藏时 :header //选择属于 header...//结果为第 index 个节点的 Element :even //结果属于偶数的 Element :first...$(document.querySelector('h1')); //dom对象转jquery对象 $('h1')[0]; or $('h1').get(0);...//jquery对象转dom对象 $('a'); //现在chrome好像也可以使用$()选取元素了 DOM-Insertion...$(element).hide([duration][, complete]); //隐藏元素 $(element).toggle([duration][, complete]); //显示元素开关
").show( "fast" ); // 显示隐藏的元素，带有200毫秒的过渡动画效果 $("selector").show( "slow" ); // 显示隐藏的元素，带有600毫秒的过渡动画效果...$("selector").hide(); // 隐藏显示的元素，其用法与show()相同 $("selector").toggle(); // 切换显示/隐藏元素(如果显示就隐藏，隐藏就显示)，其用法与...").slideDown(); // 显示隐藏的元素，带有向下滑动的过渡动画效果 $("selector").slideUp(); // 隐藏显示的元素，带有向上滑动的过渡动画效果 $("selector...").slideToggle(); // 切换显示/隐藏的元素，带有向上/下滑动的过渡动画效果 $("selector").fadeIn(); // 显示隐藏的元素，带有淡入的过渡动画效果 $("selector...").fadeOut(); // 隐藏显示的元素，带有淡出的过渡动画效果 $("selector").fadeToggle(); // 隐藏显示的元素，带有淡出的过渡动画效果 此外，jQuery还支持自定义基于
1 筛选[掌握] 筛选与之前“选择器”雷同，筛选提供函数 1.1 过滤 eq(index|-index)，获取第N个元素 •index：一个整数，指示元素基于0的位置...(type,[,data],fn); 第1个参数是事件类型,.当然也可以是自定义名称 第2个参数是可选参数,作为event.data属性值传递给事件对象的额外的数据对象 第3个参数则是用来绑定的处理函数...，fn) 显示 当显示成功后触发fn hide()隐藏 toggle(speed[,fn]) 切换,如果隐藏就显示，如果显示就隐藏。...，可以使匹配的元素以“滑动”的方式隐藏或显示 滑动：改变高度 slideDown，显示（从上往下） slideUp，隐藏（从下往上） slideToggle()切换 ——...serialize()方法 •该方法作用于一个jQuery对象，可以将DOM元素内容序列化为字符串。方便客户端发送请求。
:has(selector)返回值:Array匹配含有选择器所匹配的元素的元素一个用于筛选的选择器演示样例描写叙述:给全部包括 p 元素的 div 元素加入一个 text 类HTML...或者type为hidden的元素 演示样例 描写叙述:查找隐藏的 tr HTML 代码: Value 1的option；varc = ops[e.selectedIndex].value;通过获取当前訪问的option对象在数组中的位置。...Array 匹配其父元素下的第N个子或奇偶元素 ‘:eq(index)’ 仅仅匹配一个元素，而这个将为每个父元素匹配子元素。...>:nth-child(3n+2) 參数 index Number 要匹配元素的序号。
第86节：Java中的JQuery 前言复习 定时器： setInterval clearInterval setTimeout clearTimeout 显示： img.style.display...简单来说jquery是一个JavaScript库，简化了JavaScript的编程，很容易学习。...("slow","normal",or"fase")或表示动画时长的毫秒数值，fn: 在动画完成执行的函数，每个元素执行一次 // 显示段落 html代码： hello jquery代码 $("p").show() jquery库可以通过一行简单的代码添加到网页中，库包含html元素选取和操作，css操作，html事件函数，JavaScript特效和动画...this).hide()隐藏当前的 HTML 元素 $(selector).action() $(this).hide() - 隐藏当前元素 jquery函数 // 为了防止文档完全加载就绪之前运行的代码
”/> 最简单、最便捷，提示消息使用jQuery.Validate的内置的消息（自定义扩展验证规则也属于此项），但是由于是以样式名的方式进行验证，导致了日后修改必须找到相应的input对象，同时无法使用高级验证规则...，具体说明请向下看 2、同第1条，这种验证规则方式也是在input对象中书写class样式，只不过书写的方式改为了JSON格式，但是这种方式提供了自定义验证消息的支持： 如对象纠缠在一起，并且还增加消息自定义，使得input对象变的更大了，干扰了页面代码的阅读，但可以使用高级验证规则（实际就是将第3种JS以JSON的格式放到具体的class中 3、这种方式使用纯JS的方式...：var opts = null;，这样根据HTML从上到下的解析方式首先opts被定义，然后在每个子页面被赋值，最后再返回母版页中的jQuery.Validate初始拦截form方法： jQuery...2、下一篇将对jQuery.Validate的使用过程中会碰到的问题进行介绍，如第2种验证方式更改验证规则所处的属性、指定验证信息显示位置等。 源代码下载：点我下载
jQuery是一个流行的JavaScript库，它简化了在网页开发中对DOM操作、事件处理、动画效果和AJAX等功能的实现。...主要特点包括：简化的DOM操作： jQuery通过提供简洁的API，简化了对DOM元素的选择、遍历和操作，使得开发者能够更轻松地操作网页元素。...获取元素//$(选择器)$('div')//获取页面中的所有div元素,返回的是jQuery对象get()参数为索引，返回值是原生对象eq()参数为索引，返回值为jQuery对象操作类名hasClass...show()让该元素显示hide()让该元素隐藏fadeIn()淡入fadeOut()淡出操作元素html()操作元素的标签内容，用法与原生innerHTML相似text()操作元素的文本内容，用法与原生...:50, fontSize:20, paddingLeft:10})// 若传一个对象 就是批量设置remove()删除该元素及其子元素empty()删除该元素的子元素插入元素append()作为元素的最后一个子节点插入
基本选择器（*） 在开发过程中，jQuery对象的定义 var $obj=$("选择的对象")； //$obj为自定义的元素名 id选择器 $("#id"); 选中的结果是该元素的jQuery对象 标签选择器...$("标签名称");jquery对象的集合，如果选择结果只有一个，那么是当前对象 类选择器 $(".类名"); jQuery对象的集合，类名是在css中定义 并集选择器 $("selector1seletor2...全局选择器 $("*"); jQuery对象的集合，会选中所有 层次选择器（*） 后代选择器 $("selector1 selector2"); 选择selector1内部所有满足selector2的元素...； eq后的元素index重新按照0进行排列才能取出正确的数据（推荐显示先用lt，再使用eq）； 可见性过滤选择器 :visible 选取所有可见元素（占据文档流的位置。...(index) 匹配其父元素下的第N个子或奇偶元素； 注意：index值从1开始，可以是数字， 可以是even偶数，odd奇数， 可以使用表达式2n,3n,3n+1.
前言 jQuery 是一个轻量级的”写的少，做的多”的 JavaScript 库。...极大地简化了 JavaScript 编程 jQuery 库包含以下功能： HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改...隐藏和显示 jQuery 提供了隐藏和显示元素的基本方法 hide() 隐藏元素 show() 显示元素 toggle() 切换显示和隐藏 示例 如果你点击“隐藏” 按钮，我将会消失... 隐藏 显示 toggle...是你定位的元素对象 点我 提交按钮 $(document).ready
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
对象存储
云直播
