【10分钟-jQuery过滤选择器】的更多相关文章

10分钟-jQuery过滤选择器

1.:first过滤选择器 本次我们介绍过滤选择器,该类型的选择器是依据某过滤规则进行元素的匹配.书写时以":"号开头,通经常使用于查找集合元素中的某一位置的单个元素. 在jQuery中,假设想得到一组同样标签元素中的第1个元素该如何做呢? 在以下的演示样例代码中你可能注意到我们会使用 $("li:first") 注意:书写时以":"号开头. 样例:鉴于:first和:last功能相近.使用:last给最后的li标签文字加入红色: <div…

jQuery过滤选择器:first和:first-child的区别，CSS伪类:first-child

最近项目中遇到需求:只在第一列不能删除,不显示小叉号:点击可添加一列,后面的列右上角显示小叉号,可以点击删除. 我是使用以下方法解决这个小需求 :CSS伪类选择器:first-child设置所有小叉号不显示,当点击添加一列时,用jQuery过滤选择器只控制第一个不显示小叉号 .rule-delete { position: absolute; right: 16px; top: 11px; width: 20px; height: 20px; background: url("../../hom…

jQuery过滤选择器

//基本过滤器$('li:first').css('background','#ccc');//第一个元素$('li:last').css('background','red');//最后一个元素$('li:not(.red)').css('background','red');//非class为red的元素$('li:even').css('background','red');//索引为偶数的元素$('li:odd').css('background','red');//索引为奇数的元素$(…

jQuery过滤选择器:not()方法使用介绍

在jQuery的早期版本中,:not()筛选器只支持简单的选择器,说明我们传入到:not这个filter中的selector可以任意复杂,比如:not(div a) and :not(div,a) <p class="a">sdfsdfs</p> <p class="b">sdfsdfs</p> <p class="c">sdfsdfs</p> $("p:not(.…

jQuery过滤选择器:not()方法介绍

jQuery(':not(selector)') 在jQuery的早期版本中,:not()筛选器只支持简单的选择器,说明我们传入到:not这个filter中的selector可以任意复杂,比如:not(div a) and :not(div,a)   <p >"a">sdfsdfs</p>   <p >"b">sdfsdfs</p>   <p >"c">sdfsdfs&…

009 jquery过滤选择器-----------（表单对象属性过滤选择器 与 表单选择器）

1.表单对象属性选择器 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="jquery-3.2.1.min.js"></script> <scr…

Jquery过滤选择器，选择前几个元素，后几个元素，内容过滤选择器等

一.基本过滤选择器(重点掌握下列八个):first 选取第一个元素 $("div:first").css("color","red");:last 选取最后一个元素 $("div:last").css("color","red");:not 除去指定的选择器外的元素 $("div:not").css("color","red")…

jQuery过滤选择器具体解释

基本过滤选择器 选取第一个元素(:first) //选择第一个div元素. $('#btn1').click(function(){ $('div:first').css("background","#bfa"); }) 选取最后一个元素(:last) //选择最后一个div元素. $('#btn2').click(function(){ $('div:last').css("background","#bfa"); }) 去…

10分钟-jQuery-基础选择器

1.id 选择器 jquery能使用CSS选择器来操作网页中的标签元素.假设你想要通过一个id号去查找一个元素,就能够使用例如以下格式的选择器: $("#my_id") 当中#my_id表示依据id选择器获取页面中指定的标签元素.且返回唯一一个元素. <div id="divtest">div的内容</div> <div id="default"></div> <script type=&qu…

基础2.Jquery过滤选择器

                     1.基础选择器: 名称 说明 举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的名称选择, $("a") 选择所有<a>元素 .class 根据元素的css类选择 $(".bgRed") 选择所用CSS类为bgRed的元素 * 选择所有元素 $("*")选择页面所有元素 selector1, selector2, s…

【jQuery】(2)---Jquery过滤选择器

                     1.基础选择器: 名称 说明 举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的名称选择, $("a") 选择所有<a>元素 .class 根据元素的css类选择 $(".bgRed") 选择所用CSS类为bgRed的元素 * 选择所有元素 $("*")选择页面所有元素 selector1, selector2, s…

007 jquery过滤选择器-----------（屬性过滤选择器）

1.介紹 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa…

004 jquery过滤选择器-----------（基本过滤选择器）

1.介绍 2.常见基本过滤器 3.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; backgr…

JQuery 过滤选择器 与属性修改的方法演示比较

文本匹配 在表单输入项里面输入值,根据输入值,点击判断按钮,让对应的复选框选中 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src=&q…

008 jquery过滤选择器-----------（子元素过滤选择器）

1.介紹 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa…

006 jquery过滤选择器-----------（可见性过滤选择器）

1.介绍 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa…

005 jquery过滤选择器-----------（内容过滤选择器）

1.介绍 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa…

jquery :checked(过滤选择器) 和 空格:checked(后代选择器)

jquery 过滤选择器 和 后代选择器 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ include file="/WEB-INF/jsp/common/base.jsp"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HT…

Jquery的过滤选择器分为哪几种？

Jquery的过滤选择器分为哪几种? 转载▼ 标签: jquery 过滤选择器 分类 分类: JQuery 所有的过滤选择器分为哪几种: 一.基本过滤选择器(重点掌握下列八个) :first 选取第一个元素 $("div:first").css("color","red"); :last 选取最后一个元素 $("div:last").css("color","red"); :not 除去…

jquery :checked(过滤选择器) 和 空格:checked(后代选择器)【转】

jquery 过滤选择器 和 后代选择器 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ include file="/WEB-INF/jsp/common/base.jsp"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HT…

JQuery -- 介绍，选择器及其示例， 基本选择器，层次选择器，过滤选择器，表单选择器

1. 什么是jQuery对象 jQuery 对象就是通过jQuery包装DOM对象后产生的对象. jQuery对象是jQuery独有的.如果一个对象是jQuery对象,那么它就可以使用jQuery里的方法:$("#test").html(); 比如: $("#test").html()  意思是指:获取ID为test的元素内的html代码.其中html()是jQuery里的方法 这段代码等同于用DOM实现代码: document.getElementById(&qu…

jQuery 简单过滤选择器

<!DOCTYPE HTML> <html> <head> <title> 使用jQuery基本过滤选择器 </title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> </head> <body> <div> <h1>基本过滤选择器</h1> <…

JQuery 可见性过滤选择器

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>使用可见性过滤选择器</title> <link href="../../…

JQuery 内容过滤选择器

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link href="../../CSS/2-8.css" rel="stylesheet&…

jQuery选择器介绍：基本选择器、层次选择器、过滤选择器、表单选择器

选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.因此,如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果.jQuery选择器完全继承了CSS的风格.利用jQuery选择器,可以非常便捷的找出特定的DOM元素,然后为它们添加相应的行为,而无需担心浏览器是否支持这一选择器. jQuery选择器可简单分为基本选择器.层次选择器.过滤选择器.表单选择器.下面通过表格进行一一介绍. 1.基本选择器 选择器 描 述 返 回 示 例 #id 匹…

jQuery选择器之表单对象属性过滤选择器Demo

测试代码: 08-表单对象属性过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta…

jQuery选择器之子元素过滤选择器Demo

测试代码: 07-子元素过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta ht…

jQuery选择器之可见性过滤选择器Demo

测试代码 05-可见性过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta htt…

jQuery选择器之内容过滤选择器Demo

测试代码: 04-内容过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta htt…

jQuery选择器之基本过滤选择器Demo

测试代码: 03-基本过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta htt…