jquery name选择器

jQuery

若如初见. 提交于 2019-12-23 21:55:27
【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 基本选择器 选择器 实例 选取 元素选择器 $("p") 在页面中选取所有 <p> 元素 #id 选择器 $("#test") 页面中元素的 id 应该是唯一的,所以您要在页面中选取唯一的元素需要通过 #id 选择器 .class 选择器 $(".test") 通过指定的 class 查找元素 层次选择器 选择器 实例 选取 parent > child $("div > p") <div> 元素的直接子元素的所有 <p> 元素,只选择子元素的 parent descendant $("div p") <div> 元素的后代的所有 <p> 元素,包含子元素、孙子元素 element + next $("div + p") 每个 <div> 元素相邻的同级的下一个 <p> 元素 element ~ siblings $("div ~ p") <div> 元素同级的所有 <p> 元素 $("#two").siblings("div") 选择 id 为 two 的元素所有 div 兄弟元素 $("#one").nextAll("span:first") 选择 id 为 one 的下一个 span 元素 $("#two").prevAll("div") 选择 id 为 two 的元素前边的所有的 div 兄弟元素

jQuery表单选择器

南楼画角 提交于 2019-12-23 12:12:36
表单作为HTML中一种特殊的元素,操作方法较为多样性和特殊性,开发者不但可以使用之前的常规选择器或过滤器,也可以使用jQuery为表单专门提供的选择器和过滤器来准确的定位表单元素。 一.常规选择器 <body> <form> <input type="text" name="user" value="123" /> <input type="password" name="pass" value="456" /> </form> </body> 可以使用id、类(class)和元素名来获取表单字段,如果是表单元素,都必须含有 name属性,还可以结合属性选择器来精确定位。 $(function () { alert($('input').size()); //2个input alert($('input').val()); //元素名定位,默认获取第一个value值:123 alert($('input[name=pass]').val()); //选择name为user的字段获取第二个value值:456 }); 那么对于id和类(class)用法比较类似,也可以结合属性选择器来精确的定位,在这里我们不在重复。对于表单中的其他元素名比如:textarea、select和button等,原理一样,不在重复。 二.表单选择器 虽然可以使用常规选择器来对表单的元素进行定位

JQuery选择器【二】

大城市里の小女人 提交于 2019-12-23 12:12:16
可见性选择器    注意:下面的代码中的console.log()在火狐浏览器或者谷歌浏览器中运行,请大家在浏览器的控制台中查看运行的结果,造成不便之处请原谅! <body> <input type="hidden" name="name" value=" " /> <input type="text" name="name" value=" " /> <div id="divNone" style="display: none;"> </div> <div id="divBlock" style="display: block;"> </div> <div id="divHidden" style="visibility: hidden;"> </div> <div id="divVisible" style="visibility: visible;"> </div> </body>   :hidden 选取所有不可见的元素 //选取所有不可见的元素 console.log($(":hidden")); //$(":hidden")选取所有不可见的元素。包括<input type= "hidden"/>,<div style= "display:none">等元素。 //如果只想选取<input>元素,可以使用$("input:hidden") console.log($(

jQuery帮助文档

廉价感情. 提交于 2019-12-23 09:02:08
jQuery 库 - 特性 基础 jQuery 实例 jQuery 是一个 JavaScript 函数库。 下面的例子演示了 jQuery 的 hide jQuery 库包含以下特性: 实例 HTML 元素选取 <html> HTML 元素操作 <head> CSS 操作 <script type="text/java HTML 事件函数 <script type="text/javascr JavaScript 特效和动画 $(document).ready(function HTML DOM 遍历和修改 $("button").click(function AJAX $("p").hide(); Utilities }); }); </script> </head> <body> <h2>This is a heading</h2> <p>This is a paragraph.</p <p>This is another paragra <button type="button">Clic </body> </html> jQuery 语法 jQuery 语法是为 HTML 元素的选取编制,可以对元素执行某些操作。 基础语法是:$(selector).action() 美元符号定义 jQuery 选择符(selector)“查询”和“查找” HTML 元素 jQuery

jQuery快速入门

陌路散爱 提交于 2019-12-22 07:44:04
一、jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互,能够极大地简化JavaScript编程。它的宗旨就是:“Write less, do more.“ 二、jQuery的优势 一款轻量级的JS框架。jQuery核心js文件才几十kb,不会影响页面加载速度。 丰富的DOM选择器,jQuery的选择器用起来很方便,比如要找到某个DOM对象的相邻元素,JS可能要写好几行代码,而jQuery一行代码就搞定了,再比如要将一个表格的隔行变色,jQuery也是一行代码搞定。 链式表达式。jQuery的链式操作可以把多个操作写在一行代码里,更加简洁。 事件、样式、动画支持。jQuery还简化了js操作css的代码,并且代码的可读性也比js要强。 Ajax操作支持。jQuery简化了AJAX操作,后端只需返回一个JSON格式的字符串就能完成与前端的通信。 跨浏览器兼容。jQuery基本兼容了现在主流的浏览器,不用再为浏览器的兼容问题而伤透脑筋。 插件扩展开发。jQuery有着丰富的第三方的插件,例如:树形菜单、日期控件、图片切换插件、弹出窗口等等基本前端页面上的组件都有对应插件,并且用jQuery插件做出来的效果很炫

Jquery

谁说我不能喝 提交于 2019-12-21 22:18:08
目录 day01 - jQuery 1.1. jQuery 介绍 1.1.1 JavaScript 库 1.1.2 jQuery的概念 1.1.3 jQuery的优点 1.2. jQuery 的基本使用 1.2.1 jQuery 的下载 1.2.2. 体验jQuery 1.2.3. jQuery的入口函数 1.2.4. jQuery中的顶级对象$ 1.2.5. jQuery 对象和 DOM 对象 1.2.6. jQuery 对象和 DOM 对象转换 1.3. jQuery 选择器 1.3.1. 基础选择器 1.3.2. 层级选择器 1.3.3. 筛选选择器 1.3.4 知识铺垫 1.3.5 案例:淘宝服饰精品案例 1.4. jQuery 样式操作 1.4.1. 方法1: 操作 css 方法 1.4.2. 方法2: 设置类样式方法 1.4.3. 案例:tab 栏切换 1.5. jQuery 效果 1.5.1. 显示隐藏 1.5.2. 滑入滑出 1.5.3 淡入淡出 1.5.4 自定义动画 1.5.5 停止动画排队 1.5.6. 事件切换 1.5.7. 案例:王者荣耀手风琴效果 1.6. 今日总结 day02 - jQuery 1.1. jQuery 属性操作 1.1.1 元素固有属性值 prop() 1.1.2 元素自定义属性值 attr() 1.1.3 数据缓存 data() 1

jquery checked选择器 语法

∥☆過路亽.° 提交于 2019-12-19 15:20:27
jquery checked选择器 语法 作用: :checked 选择器选取所有选中的复选框或单选按钮。 直线电机参数 语法: $(":checked") jquery checked选择器 示例 <html> <head> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".btn1").click(function(){ $(":checked").hide(); }); }); </script> </head> <body> <form action=""> <input type="radio" name="sex" value="male" checked="checked"/> Male <br /> <input type="radio" name="sex" value="female" /> Female <br /> I have a bike: <input type="checkbox" name="vehicle" value="Bike" /> <br /> I have

[翻译]帮助文档-jQuery 选择器

喜夏-厌秋 提交于 2019-12-18 15:21:05
jQuery的选择器是CSS 1-3,XPath的结合物。jQuery提取这二种查询语言最好的部分,融合后创造出了最终的jQuery表达式查询语言。如果你了解CSS(绝大部分WEB开发者都用到的),那么你学起来就很容易了。 同时使用CSS和XPath 看几个例子: 隐藏所有包含有链接的段落: $("p[a]").hide(); 显示页面的第一个段落: $("p:eq(0)").show(); 隐藏所有当前可见的层元素: $("div:visible").hide(); 获取所有无序列表的列表项: $("ul/li") /* valid too: $("ul > li") */ 取得name值为bar的输入字段的值: $("input[@name=bar]").val(); 所有处于选中状态的单选r按钮: $("input[@type=radio][@checked]") 如果你对查询语言的工作原理还有疑问,可以 订阅这里的邮件列表 。 CSS查询器 jQuery完全支持CSS1.3。 关于CSS的一些资料查看下面的连接: CSS 1 CSS 2 CSS 3 下面列出来的是支持的CSS查询器的列表式语法: * 任何元素 E 类型为E的元素 E :root 类型为E,并且是文档的根元素 E:nth-child(n) 是其父元素的第n个类型为E的子元素 E:first-child

jQuery - 选择器

故事扮演 提交于 2019-12-10 13:14:13
1. 基本选择器 // 标签选择器 : 所有标签为td的元素 console.log($("td")); // ID选择器 : ID为td1的元素 console.log($("#td1")); // 类选择器 console.log($(".txtColor")); // 所有class属性值为txtColor的元素 console.log($("td.txtColor")); // 所有td元素中, class值为txtColor的元素 // 通配选择器 : 所有元素 console.log($("*")); // 并集选择器 : 选择所有tr和td元素 console.log($("tr,td")); // 后代选择器 : body标签下所有子标签是span标签的元素 (包含孙子) console.log($("body span")); // 父子选择器 : body标签下所有子标签是span标签的元素 (不包含孙子) console.log($("body>span")); // 后面第一个兄弟元素 : 选择id为#tr1的元素的下一个tr元素 console.log($("#tr1+tr")); // 后面所有兄弟元素 : 选择id为#tr1的元素后面所有的兄弟级tr元素 console.log($("#tr1~tr")); <style> .txtColor {

jQuery基础总结(后续整理)

社会主义新天地 提交于 2019-12-09 18:55:59
jQuery jQuery:是一个javascript库 核心理念是write less,do more(写得更少,做得更多) 内部帮我们把几乎所有功能都做了封装,相比基于DOM、BOM的操作会更加简单,兼容性更好 jQuery引入 本身是一个js文件 <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"> </script> 本地文件引入 <script src="jquery.js"></script> 另起一个script标签来写script代码 或写在js文件里, 再 <script src="test3(3).js"></script>导入 JQuery和dom对象的转换 $ == Jquery dom对象 _> jq对象 $(dom对象) jq对象 _> dom对象 jq对象[0] 选择器 $('#d1') id选择器 var d1 = $('#d1'); -- jquery对象 -- jQuery.fn.init [div#d1] a.css({"background-color":"blue","height":"300px"}) var d = document.getElementById('d1'); -- 原生dom对象 jquery对象和dom对象之间不能调用互相的方法 a[0] --