jQuery选择器---层次选择器总结】的更多相关文章

假设想通过DOM元素之间的层次关系来获取特定元素,比如后代元素,子元素,相邻元素,兄弟元素等,则须要使用层次选择器. 1 .ancestor descendant 使用方法: $("form input") ;   返回值  集合元素 说明:在给定的祖先元素下匹配全部后代元素.这个要以下讲的"parent> child"区分开. .parent > child 使用方法: $("form > input") ;    返回值 …
今天要分享的是jQuery层次选择器,层次选择器的分类如图: 接下来就开始了 要不先养养眼精神一下: 开始1.祖先选择器: 案例: <form> <label>Name:</label> <input name="name" /> <fieldset> <label>Newsletter:</label> <input name="newsletter" /> </…
一.Jquery常用的过滤选择器如下所示: 1.:first,选取第一个元素,比如$("div:first")选取第一个div元素 2.:last,选取最后一个元素,比如$("div:last")选取最后一个div元素 3.:not(选择器),选取不满足“选择器”条件的元素,比如$("div:not(.className)"),选取样式不是className的所有div元素 4.:even/:odd,选取索引为偶数/奇数的元素,比如$("…
层次选择器: 查找子元素, 后代元素, 兄弟元素的选择器1. ancestor descendant 在给定的祖先元素下匹配所有的后代元素2. parent>child 在给定的父元素下匹配所有的子元素3. prev+next 匹配所有紧接在 prev 元素后的 next 元素4. prev~siblings 匹配 prev 元素之后的所有 siblings 元素 html: <ul> <li>AAAAA</li> <li class="box&q…
一.JQuery选择器的概述 选择器是JQuery的根基,在JQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器. 二.选择器的优势 1.简洁的语法 2.支持CSS1.0到CSS3.0选择器 3.完善的处理机制 三.基本选择器 名称 语法构成 描述 实例 标签选择器 element 根据给定的标签名匹配元素 $("h2" )选取所有h2元素 类选择器 .class 根据给定的class匹配元素 $(" .title")选取所有class为title的元…
从学习jquery开始,现在已经是第三遍看锋利的jQuery这本书了,现在打算对jQuery中的各种选择器进行一下总结,主要是是为了进一步系统的巩固自己对知识的掌握,另外也可以为那些学习jQuery并不小心进入我的博客的同学提供一个知识交流的机会. jQuery选择器分为基本选择器,层次选择器,过滤选择器和表单选择器 1.基本选择器 基本选择器其实就是通过元素的id,class和标签名等查找DOM元素的规则的集合,也是jquery中常用的最基本的选择器,掌握基本选择器对于学习jquery很重要.…
第四章 jQuery框架的选择器 4.1 jQuery选择器说明 jQuery 最核心的组成部分就是选择器引擎.它完全继承了 CSS 的风格,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确的选 择,而且不必担心浏览器的兼容性,写法更加简洁. jQuery 选择器实现了 CSS1~CSS3 的大部分规则之外,还实现了一些自定义的选择器,用于各种特殊状态的选择. 优点:相对于直接使用 JavaScript 获取页面元素和处理业务逻辑相比,使用jQuery 选择器来进行操作代码更简单且拥有…
JQuery选择器 JQuery 选择器继承了CSS 与Path 语言的部分语法,允许通过标签名.属性名或内容对DOM 元素进行快速.准确的选择,而不必担心浏览器的兼容性,通过jQuery 选择器对页面元素的精准定位,才能完成元素属性和行为的处理. 一.选择器的优势 代码更简单 $(function(){ $("#tbStu tr:nth-child(even)").addClass("trOdd"); }) 上面代码如果使用原生JavaScript实现的话:1.获…
O(∩_∩)O~~~,今天简单整理了一下最近所学的Jquery知识.下面就总结一下. 首先,对于Jquery我们需要简单了解下: 1.Jquery是开放源代码的JS库, 2.Jquery操作是函数式编程,所有操作都是方法.$代替Jquery 3.Jquery页面加载 $(document).ready(function () {alert("hello world") }); //$(function () { alert("hello world") }) //简…