1. jQuery选择器 - 选择器都是以 $() 开头的 基础选择器 选择器 描述 id选择器 指定id元素 class选择器 遍历css类元素 element元素 遍历HTML元素 *选择器 遍历所有元素...并列选择器 这类选择器将每一个选择器匹配到的元素合并后一起返回 id="notMe">id="notMe" id="myDiv">id="...][name("input[id][name("input[id][name=‘man’]") ("input[id][name("input[id][name("input[id][name =‘man...操作元素的CSS样式 CSS类别操作 jQuery为用户提供了3种CSS类别操作方法： ---- - 添加css样式：addClass()，参数可选，空格隔开 按一直触发 返回键盘代码 keypress 在键盘上按下一个能产生字符的按键时触发 返回ASCII码 keyup 松开某一键时触发 返回键盘代码 jQuery的事件处理 1. jQuery常用的事件方法
（4）jQuery对象 二、选择器的使用 1、基本选择器 2、层级选择器 3、筛选选择器 总结 ---- 前言 什么是jQuery？...).ready() 执行时机 必须等待网页中的所有内容加载完成后才能执行 网页中的所有DOM绘制完成后就执行，可能关联内容并未加载完成 编写个数 不能编写多个 能编写多个，依次执行 简化写法 无 $0...名称 用法 描述 id选择器 $("#id") 获取指定id的元素 全选择器 $("*") 匹配所有元素，*为正则表达式 类选择器 $(".class") Index页面的结构文件获取同一类clas的元素...2、层级选择器 jQuery层级选择器：层级选择器可以完成多层级元素之间的获取。...名称 用法 描述 子代选择器 $("ul > li") 获取子级元素 后代选择器 $("ul li") 获取后代元素 3、筛选选择器 筛选选择器用来筛选元素，通常和别的选择器搭配使用。
jQuery概述 Write Less Do More（用更少的代码来完成更多的工作） 使用CSS选择器来查找元素（更简单更方便） 使用jQuery方法来操作元素（解决浏览器兼容性问题、应用于所有元素并施加多个方法...） 引入jQuery 下载jQuery的开发版和压缩版 从CDN加载jQuery jquery/3.3.1/jquery.min.js...">') 查找元素 选择器 * / element / #id / .class / selector1, selector2 ancestor descendant.../ parent>child / previous+next / previous~siblings 筛选器 基本筛选器：:not(selector) / :first / :last / :even...parent / :has(selector) 可见性筛选器：:hidden / :visible 子节点筛选器：:nth-child(expr) / :first-child / :last-child
中，不需要手动写for循环了，会自动进行遍历。...jquery-1.12.4.js:未压缩版本，适用于学习与开发环境，源码清晰，易阅读。 入口函数 入口函数的好处： 1. 等待文档加载完成，保证能够获取到元素 2....2.jQuery的入口函数只会等待文档树加载完成就开始执行，并不会等待图片、文件的加载。 jQuery对象与DOM对象(重点) 基本概念： 1....css选择器 jQuery完全兼容css选择器 名称 用法 描述 ID选择器 $(“#id”); 获取指定ID的元素 类选择器 $(“.class”); 获取同一类class的元素 标签选择器 $(“div...(方法) 筛选选择器的功能与过滤选择器有点类似，但是用法不一样，筛选选择器主要是方法。
利用jQuery UI中Auto-complete插件实现输入自动完成功能，大家在使用诸如淘宝、京东等电商平台搜索商品时，往往只要输入商品的一些特殊字符，就可以显示出和该字符相近的列表菜单，用户使用鼠标或者键盘方向键就可以快速选择...1.最简单的用户输入自动完成 <!... $("#tags").autocomplete({ //自动完成字典库数据源 source: availableTags...="tags"> 2 使用远程数据源自动完成 Auto-complete插件不光可以实现本地数据源的自动完成，也可以读取远程的数据源，列如实现从服务器端读取数据源信息...$(function() { //自定义缓存变量 var cache = {}; //自动完成插件函数 $("#tags").autocomplete({
、修改资产 盘点 搜索、筛选、刷新、删除盘点单、开始盘点、结束盘点、录入/修改/查看盘点结果 报表 按资产状态、资产类别、供应商、品牌、取得方式、存放地点进行统计 业务描述 资产管理员、超级管理员需要通过登录页面进入...资产查询： 系统支持使用“资产编码/名称”进行模糊查询； “资产状态”筛选条件包括“正常”、“已报废”； “资产类别”筛选条件包含所有已启用、已禁用的类别； “取得方式”筛选条件包含所有已启用、已禁用的方式...资产管理员仅记录资产转移流水，完成转移登记操作后，系统自动将原使用人的借用单状态置为“已归还”，同时各生成一条关于新使用人的借用单和转移单。...注意，新增盘点单的操作在web端完成。...，返回统计报表页面； 按资产类别统计： 在统计报表页面，点击“按资产类别统计”，进入按资产类别统计页面； 页面上方显示柱状图，根据资产数量升序排列； 页面下方显示列表：显示各资产类别下的的资产数量及相应比例
前言 通过 jQuery 遍历，从被查找当前元素开始，在家族树中向上移动（祖先），向下移动（子孙），水平移动（兄弟），这种移动被称为对 DOM 进行遍历。...jquery 遍历 id="p" class="text-info">hello world id="p1" class...//[h3] console.log(d); e = $('#p').prevAll(); //[h3] console.log(e); 查询结果过滤 从查询结果中继续筛选...，可以按查询结果的顺序按下标取值 first() 返回查询结果中第一个元素 last() 返回查询结果中最后一个元素 eq() 返回指定索索引的元素，下标从0开始 示例 // first...(a1); // not() a2 = $('p').not('#p'); console.log(a2); 2022年第 11 期《python接口web自动化+测试开发》课程
使用jQuery jQuery概述 Write Less Do More（用更少的代码来完成更多的工作） 使用CSS选择器来查找元素（更简单更方便） 使用jQuery方法来操作元素（解决浏览器兼容性问题...-3.3.1.min.js">') 查找元素 选择器 * / element / #id / .class / selector1, selector2 ancestor...descendant / parent>child / previous+next / previous~siblings 筛选器 基本筛选器：:not(selector) / :first...’) / :empty / :parent / :has(selector) 可见性筛选器：:hidden / :visible 子节点筛选器：:nth-child(expr) / :first-child.../ :last-child / :only-child 属性筛选器：[attribute] / [attribute=‘value’] / [attribute!
它可以用最少的代码, 完成更多复杂而困难的功能 jQuery的主旨:write less, do more....而这个“”就是jQuery当中最重要且独有的对象:jQuery对象 $(function () {}); 执行一个匿名函数 $(‘#idName’); 进行执行的ID元素选择 $(‘#idName...CSS样式.直接设置 CSS 样式、增加 CSS 类别、类别切换、删除等操作....() 淡出 分别表示淡入、 淡出,当然还有一个自动切换的方法: .fadeToggle() 切换淡入淡出 上面三个透明度方法只能是从 0 到 100,或者从 100 到 0,如果我们想设置指定值就没...callback:可选参数,是动画完成后所执行的函数名称。
选择表达式可以是CSS选择器： $(document) //选择整个文档对象 $('#myId') //选择ID为myId的网页元素 $('div.myClass') // 选择...设计思想之二，就是提供各种强大的过滤器，对结果集进行筛选，缩小选择结果。 ...jQuery设计思想之四，就是使用同一个函数，来完成取值（getter）和赋值（setter），即"取值器"与"赋值器"合一。到底是取值还是赋值，由函数的参数决定。 ...$.type() 判断对象的类别（函数对象、日期对象、数组对象、正则对象等等）。 $.isArray() 判断某个参数是否为数组。...（长时间按键，只返回一个事件） .keypress() 按下键盘（长时间按键，将返回多个事件） .keyup() 松开键盘 .load() 元素加载完毕 .mousedown() 按下鼠标
① 先给出不同类别、不同子类别下的利润和销售额 ② 选择类别是“家具”类的产品： ③ 选择子类别是“书架”、“桌子”类的产品： ④ 当出现如下界面时，对“条件筛选器”使用公式，筛选出销售总额大于1000000...4）tableau顶部筛选器(类似于mysql中的limit) 案例：显示家具类产品中，销售额最好的前3个子类别 ① 先列出不同类别、不同子类别下的销售额情况 ② 选择家具类别的产品 ③ 使用顶部筛选器...Ⅲ 完成1，2，3步操作，完成“下钻”。 Ⅳ 最终效果如下 注意：“年月日”的下钻，这个字段自动就会分层，自己下去试试。...① 文件夹分组为例说明 Ⅰ 选择“按文件夹分组” Ⅱ 选择“创建文件夹” Ⅲ 给文件夹命名 Ⅳ 将“订单名称”、“订单ID”拖动到文件夹中，最终效果如下 9）计算字段...完成如下步骤 ⑤ 完成如下步骤 ⑥ 重复上述步骤，筛选207年购买过的客户。
基本筛选器 表单筛选器 表单对象属性 筛选器方法 案例：菜单栏 样式操作 位置操作 案例：返回顶部 获取尺寸 文本操作 HTML代码 文本值 值 属性操作 文档处理 事件 事件绑定 移除事件 阻止后续事件执行...，在表单筛选器中对此进行了简写''' # 属性筛选器获取type=text的input元素 $('input[type=text]') #表单筛选器获取 $(':text') # 表单筛选器的特例...jquery-3.3.1.js"> var flag = false; // shift按键被按下的时候 $(window...() {}) // jQuery文档加载方式2 $(function(){}) 与window.onload的区别 window.onload()函数有覆盖现象，必须等待着图片资源加载完成之后才能调用...jQuery的这个入口函数没有函数覆盖现象，文档加载完成之后就可以调用（建议使用此函数） 事件委托 事件委托是通过事件冒泡的原理，利用父标签去捕获子标签的事件 // 将body内部所有的点击事件委托给
function(){写代码}重点2：使用 {}查找元素，使用.click()来绑定点击响应函数，把单击响应函数作为click()的参数传入即可重点3： 核心函数$ ()的四种用法 1.传入参数为函数时，文档加载完成就执行该函数...元素筛选方法----对选择器筛选后的方法，再次进行筛选 next筛选出来的是下一个紧邻元素，如果$("#one").next("span")那么下一个紧邻元素必须是span标签，否则查找不到 next...click()来绑定点击响应函数，把单击响应函数作为click()的参数传入即可 重点3：$本质是一个function方法 ---- 核心函数$ ()的四种用法 ---- 1.传入参数为函数时，文档加载完成就执行该函数...对象转化为jquery对象，改变颜色 id="b3">使用JQuery对象，改变颜色 id="b4">将Jquery对象转化为dom对象...里面提供的增强for循环.each方法 ---- 对选择器的小总结 选择器的小总结 ---- 元素筛选方法----对选择器筛选后的方法，再次进行筛选 ---- jQuery选择器总结(选择器+元素筛选
另外，也支 持查询的元素按文档顺序返回。 jQuery 1.4 （2010年1月14号）：对代码库进行了内部重写组织，开始建立一些风格规范。...:2},{b:3,c:4},{c:5:d:6}) //将多个对象，合并到第一个对象{a:1,b:3,c:5,d:6} $.makeArray() //将对象转化为数组 $.type() //判断对象的类别...如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如XML MIME类型就被识别为XML。...jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。...这个值将用来取代jQuery自动生成的随机函数名。这主要用来让jQuery生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。
Flexigrid – Web 2.0 Javscript Grid for jQuery - 可变列宽，自动适应表头宽度，可通过 Ajax 连接 XML 数据源，类似 Ext Grid，但基于 jQuery...DataTables - 非常强大的 jQuery 表格插件，可变宽页码浏览，现场过滤。多列排序，自动探测数据类型，智能列宽，可从几乎任何数据源获取数据。 ? ?...HeatColor - 根据规则，或自动对表格中的值进行分析，对不同范围的值按不同颜色区分。 ? ? Fixed Header Table - 固定表头可滚动表格 ? 表格搜索，筛选 ?...tableFilter - 给表格添加简单的筛选功能。 ? ? uiTableFilter - 根据条件筛选（隐藏）表格行 ? ?...PicNet Table Filter - 实时的，Google 式筛选功能 ? ? jQuery tinysort - http://www.21kaiyun.com在线紫微斗数星座排盘排序 ?
的筛选 综述如下： jQuery 的选择器可以的完成功能，jQuery 的筛选则提供功能相同的函数。...动画效果完成之后的回调函数。...最底层的ajax请求，编写最复杂，完成功能最全的。...会自动将字符串数据 转换成json对象。 ...jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
event.which 指示按了哪个键或按钮。...-2.2.3.js"> $(function(){ // 页面加载完成之后自动执行 $('#title').mouseover...return false } //最后,大家尝试着用jquery的绑定来完成这个功能!...jQuery 将自动替换 ?...为正确的函数名，以执行回调函数 如果不指定，jQuery 将自动根据HTTP包MIME信息返回相应类型(an XML MIME type will yield XML, in 1.4 JSON
jQuery简化了AJAX操作，后端只需返回一个JSON格式的字符串就能完成与前端的通信。 跨浏览器兼容。jQuery基本兼容了现在主流的浏览器，不用再为浏览器的兼容问题而伤透脑筋。 插件扩展开发。...jQuery内容： 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax 下载链接：jQuery官网 中文文档：jQuery AP中文文档 jQuery...$("div").find("p") 等价于$("div p") 筛选 筛选出与指定表达式匹配的元素集合。这个方法用于缩小匹配的范围。用逗号分隔多个表达式。...示例： 按 Ctrl+C 复制代码 按 Ctrl+C 复制代码 尺寸： height() width() innerHeight() innerWidth() outerHeight() outerWidth...jQuery的这个入口函数没有函数覆盖现象，文档加载完成之后就可以调用（建议使用此函数） 事件委托 事件委托是通过事件冒泡的原理，利用父标签去捕获子标签的事件。
("loadTwo"); } function loadThree(){ alert("loadThree"); } //onload的用法，页面加载完成后...#id 选取指定id名的元素 并集选择器 selector1,selector2......方法,必须是转化为jQuery节点 alert($(this).html()); //$(this)转换为jQuery节点 }); 3.6.5 end() 结束当前链条中的最近的筛选操作，并将匹配元素集还原为之前的状态...； //end():结束当前的最后一次筛选,恢复到初始状态 $(".gameList li").first().css("background-color","orange").end().last()...keyup() 键盘弹起事件 keypress 产生可打印的字符事件 键盘按下灵活应用 //键盘按下事件，判断是否是enter键，并手动提交表单 $(document).keydown(function
3）条件筛选器 案例：只显示家具类，只含“书架”、“桌子”子类并且销售总额大于1000000元并且利润大于300000元的子类。 ① 先给出不同类别、不同子类别下的利润和销售额 ?...4）tableau顶部筛选器(类似于mysql中的limit) 案例：显示家具类产品中，销售额最好的前3个子类别 ① 先列出不同类别、不同子类别下的销售额情况 ? ② 选择家具类别的产品 ?...② 拆分字段(自动拆分与自定义拆分) Ⅰ 自动按照同一个分隔符，进行拆分 ? Ⅱ 自定义拆分 ? Ⅲ 当出现如下界面时，填入分隔符，保留2列 ? Ⅳ 最终效果如下 ?...① 文件夹分组为例说明 Ⅰ 选择“按文件夹分组” ? Ⅱ 选择“创建文件夹” ? Ⅲ 给文件夹命名 ? Ⅳ 将“订单名称”、“订单ID”拖动到文件夹中，最终效果如下 ?...② 只选择2016年购买过的客户：将“年(订单日期)”拖动到筛选器中，进行选择过滤 ? ③ 当出现如下界面，勾选2016年 ? ④ 完成如下步骤 ? ⑤ 完成如下步骤 ?
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
云直播
对象存储
实时音视频
