jquery name选择器

提升效率 jQuery选择器大全 在jQuery 中,jQuery 为编写代码者提供了异常强大的选择器用来帮助我们获取页面上的对象, 并且将对象以jQuery 包装集的形式返回。本文主要对常用的jQuery 选择器进行一个介绍及归类。 jQuery 选择器大体上可分为 4 类：基本选择器、层次选择器、过滤选择器、表单选择器。 其中过滤选择器可以分为：简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器。 基本选择器： $("#myELement") 选择id值等于myElement的元素，id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div") 选择所有的div标签元素，返回div元素数组 $(".myClass") 选择使用myClass类的css的所有元素 $("*") 选择文档中的所有的元素 可以运用多种的选择方式进行联合选择：例如$("#myELement,div,.myclass") 层叠选择器： $("form input") 选择所有的form元素中的input元素 $("#main > *") 选择id值为main的所有的子元素 $("label + input") 选择所有的label元素的下一个input元素节点

jQuery 的选择器可谓之强 大无比，这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素，id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div") 选择所有的div标签元素，返回div元素数组 $(".myClass") 选择使用myClass类的css的所有元素 $("*") 选择文档中的所有的元素，可以运用多种的选择方式进行联合选择：例如$("#myELement,div,.myclass") 层叠选择器： $("form input") 选择所有的form元素中的input元素 $("#main > *") 选择id值为main的所有的子元素 $("label + input") 选择所有的label元素的下一个input元素节点，经测试选择器返回的是label标签后面直接跟一个input标签的所有input标签元素 $("#prev ~ div") 同胞选择器，该选择器返回的为id为prev的标签元素的所有的属于同一个父元素的div标签 基本过滤选择器： $("tr:first") 选择所有tr元素的第一个 $("tr:last") 选择所有tr元素的最后一个 $("input:not(:checked) + span") 过滤掉

jQuery 的选择器可谓之强大无比，这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素，id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div") 选择所有的div标签元素，返回div元素数组 $(".myClass") 选择使用myClass类的css的所有元素 $("*") 选择文档中的所有的元素，可以运用多种的选择方式进行联合选择：例如$("#myELement,div,.myclass") 层叠选择器： $("form input") 选择所有的form元素中的input元素 $("#main > *") 选择id值为main的所有的子元素 $("label + input") 选择所有的label元素的下一个input元素节点，经测试选择器返回的是label标签后面直接跟一个input标签的所有input标签元素 $("#prev ~ div") 同胞选择器，该选择器返回的为id为prev的标签元素的所有的属于同一个父元素的div标签 基本过滤选择器： $("tr:first") 选择所有tr元素的第一个 $("tr:last") 选择所有tr元素的最后一个 $("input:not(:checked) + span") 过滤掉：checked的选择器的所有的input元素

问题 你想使用类似于CSS或jQuery的语法来查找和操作元素。 方法 可以使用 Element.select(String selector) 和 Elements.select(String selector) 方法实现： File input = new File("/tmp/input.html"); Document doc = Jsoup.parse(input, "UTF-8", "http://example.com/"); Elements links = doc.select("a[href]"); //带有href属性的a元素 Elements pngs = doc.select("img[src$=.png]"); //扩展名为.png的图片 Element masthead = doc.select("div.masthead").first(); //class等于masthead的div标签 Elements resultLinks = doc.select("h3.r > a"); //在h3元素之后的a元素 说明 jsoup elements对象支持类似于 CSS (或 jquery )的选择器语法，来实现非常强大和灵活的查找功能。. 这个 select 方法在 Document , Element ,或 Elements 对象中都可以使用

一、jQuery初步认知 jQuery概述 JQuery概念 javascript概念 基于Js语言的API和语法组织逻辑，通过内置window和document对象，来操作内存中的DOM元素 JQuery概念 基于javascript的，同上，提高了代码的效率 jQuery是什么: 是一个javascript代码仓库，我们称之为javascript框架。 是一个快速的简洁的javascript框架，可以简化查询DOM对象、处理事件、制作动画、处理Ajax交互过程。 它可以帮我们做什么(有什么优势) 轻量级、体积小，使用灵巧(只需引入一个js文件) 强大的选择器 出色的DOM操作的封装 出色的浏览器兼容性 可靠的事件处理机制 完善的Ajax 链式操作、隐式迭代 方便的选择页面元素(模仿CSS选择器更精确、灵活) 动态更改页面样式/页面内容(操作DOM，动态添加、移除样式) 控制响应事件(动态添加响应事件) 提供基本网页特效(提供已封装的网页特效方法) 快速实现通信(ajax) 易扩展、插件丰富 如何引入JQuery包 引入本地的JQuery 引入Google在线提供的库文件（稳定可靠高速） 使用Google提供的API导入 写第一个JQUery案例 解释:在JQuery库中，$是JQuery的别名，$()等效于就jQuery() <script type=“text

jQuery官网： https://jquery.com/ 在线API: https://api.jquery.com/ jQuery UI： https://jqueryui.com/ API:提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码 高版本的jQuery不支持IE浏览器，注意匹配 1. 框架库和jQuery介绍 jQuery就是JavaScript语法写的一些函数类，内部仍然是调用JS实现的，所以并不是代替JS。可以说jQuery本身就是一堆JS函数，jQuery就是一个JS的函数库 2. jQuery文件使用 （1）为什么要学习jQuery？ DOM中一个简单的功能需要大量的代码；兼容问题很多；代码容错性很差；window.onload也只能有一个 （2）jQuery好处：解决浏览器兼容性问题，体积小，链式编程，隐式迭代，插件丰富，开源，免费 （例题）点击按钮出现一个蓝色小方块 < script > //Dom中写法 window . onload = function ( ) { document . getElementById ( "btn" ) . onclick = function ( ) { var divObj = document . getElementById ( "dv" ) ; divObj . style .

Web前端JQuery面试题（一） 一：选择器 基本选择器 什么是 #id ， element ， .class ， * ， selector1, selector2, selectorN ？ 答： 根据给定的 id 匹配一个元素，用于搜索，通过 id 的属性给定值。 案例：查找 id 为 da3 的元素 html代码： <div id="da1"></div> <div id="da2"></div> <div id="da3"></div> jquery代码： $("#da3"); 结果： [ <div id="da3"></div> ] html代码： <div id="da:q"></div> jquery代码： $("#da\\:q"); 根据给定的元素名匹配所有元素 案例，查找 div 元素： html代码： <div> da1 </div> <div> da2 </div> <p>da3</p> jquery代码： $("div"); 结果： [ <div> da1 </div> , <div> da2 </div> ] 根据给定的类匹配元素 html代码： <div class="dashu"> dashu </div> <div class="da"> da </div> jquery代码: $(".da"); 结果: [ <div class="da"> da

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

一.JQuery的插件主要分为3种： 1.封装对象方法的插件。 如JQuery的parent()方法，appendTo()方法，addClass()方法等。 2.封装全局函数的插件。 如JQuery.ajax()，JQuery.trim()方法 3.选择器插件。 二.JQuery的插件机制： i.JQuery提供了两个用于扩展JQuery功能的方法，jQuery.fn.extend()方法和jQuery.extend()方法。前者用于扩展前面的提到的第一种插件，后者用于扩展后两种插件。这两个方法都接收一个类型为Object的参数。 ii.所有的对象方法都应附加到jQuery.fn对象上，所有全局函数都应附加到jQuery对象本身上。 iii.在插件内部，this指向JQuery对象。 iv.插件应结尾加分号，避免压缩带来错误。在开头也最好加分号，避免他人的不规范代码给插件带来影响。 v.插件应该返回一个JQuery对象，以保证插件的可链式操作。除非插件需要返回的是一些需要获取的量。 三.插件示例： 1.封装JQuery对象方法的插件。 下面是一个简单的color插件，主要实现获取和配置元素颜色的功能。 首先创建jquery.color.js文件。 搭好框架： ;(function($){ })(jQuery); 由于是对JQuery对象方法的扩展，采用jQuery.fn

一、$(document).ready() 是个什么函数？为什么要用它？ ready() 函数用于在文档进入ready状态时执行代码。当DOM 完全加载（例如HTML被完全解析DOM树构建完成时），jQuery允许你执行代码。使用$(document).ready()的最大好处在于它适用于所有浏览器，jQuery帮你解决了跨浏览器的难题。需要进一步了解的用户可以点击 answer链接查看详细讨论。 二、JavaScript window.onload 事件和 jQuery ready 函数有何不同？ 　这个问答是紧接着上一个的。JavaScript window.onload 事件和 jQuery ready 函数之间的主要区别是，前者除了要等待 DOM 被创建还要等到包括大型图片、音频、视频在内的所有外部资源都完全加载。如果加载图片和媒体内容花费了大量时间，用户就会感受到定义在 window.onload 事件上的代码在执行时有明显的延迟。 　　另一方面，jQuery ready() 函数只需对 DOM 树的等待，而无需对图像或外部资源加载的等待，从而执行起来更快。使用 jQuery $(document).ready() 的另一个优势是你可以在网页里多次使用它，浏览器会按它们在 HTML 页面里出现的顺序执行它们，相反对于 onload 技术而言，只能在单一函数里使用