jQuery的:gt选择器

:gt选择器的定义和用法:

此选择器匹配所有索引值大于给定索引值的元素。

索引值最小是从0开始的。

语法结构:

$(":gt(index)")

此选择器一般也要和其他选择器配合使用,比如类选择器和元素选择器等等。例如:

$("li:gt(0)").css("color","blue")

以上代码能够将索引大于0的li元素中的字体颜色设置为绿色。

如果不和其他选择器配合使用,则默认状态是和*选择器配合使用,例如$(":gt")等同于$("*:gt")。

参数列表:

参数 描述
index 给定的索引值

实例代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("#btn").click(function(){
    $("li:gt(0)").css("color","blue");
  })
})
</script>
</head>
<body>
<ul>
  <li>html专区</li>
  <li>div+css专区</li>
  <li>jQuery专区</li>
  <li>Javascript专区</li>
</ul>
<button id="btn">点击查看效果</button>
</body>
</html>

以上代码能够将li元素集合中索引值大于0的li元素中的字体颜色设置为蓝色。

实例二:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51texiao.cn/" />
<title>蚂蚁部落</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("#btn").click(function(){
    $(":gt(1)").css("color","blue");
  });
});
</script>
</head>
<body>
<ul>
  <li>html专区</li>
  <li>div+css专区</li>
  <li>jQuery专区</li>
  <li>Javascript专区</li>
</ul>
<button id="btn">点击查看效果</button>
</body>
</html>

由于以上代码并没有指定与:gt选择器相配合使用的选择器,所以就默认和*选择器配合使用,于是以上代码可以将当前文档中所有元素中索引值大于1的元素中的字体颜色设置为蓝色。

原文地址是:http://www.51texiao.cn/jqueryjiaocheng/2015/0613/4200.html

最为原始地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=5362

时间: 2024-08-07 23:11:52

jQuery的:gt选择器的相关文章

jQuery中的选择器

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <!DOCTYPE html PUBLIC "-//W3C//DTD

jQuery基础知识--选择器与效果

$(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class="test"的元素 $("#test").hide()--隐藏所有id="test"的元素 文档就绪函数 $(document).ready(function() {     ---------jQuery function go here----

非常easy学习的JQuery库 : (二) 选择器

作用 选择器同意您对元素组或单个元素进行操作. 在前面的章节中,我们介绍了一些有关怎样选取 HTML 元素的实例. 关键点是学习 jQuery 选择器是怎样准确地选取您希望应用效果的元素. jQuery 元素选择器和属性选择器同意您通过标签名.属性名或内容对 HTML 元素进行选择. 选择器同意您对 HTML 元素组或单个元素进行操作. 在 HTML DOM 术语中: 选择器同意您对 DOM 元素组或单个 DOM 节点进行操作. 元素选择器 jQuery 使用 CSS 选择器来选取 HTML 元

HTML5移动开发之路(34)——jQuery中的选择器

本文为 兄弟连IT教育 机构官方 HTML5培训 教程,主要介绍:HTML5移动开发之路(34)--jQuery中的选择器 一.jQuery是什么? jQuery是由美国人John Resig创建,至今吸引了来自世界各地的众多JavaScript高手加入其中. jQuery的创始人和技术领袖,目前在Mozilla担任JavaScript工具开发工程师.著有<Pro JavaScript Techniques>(即<精通JavaScript>)等经典JavaScript书籍. jQu

[ jquery 属性 .selector ] 此选择器返回传给jQuery()的原始选择器

返回传给jQuery()的原始选择器:换句话说,就是返回你用什么选择器来找到这个元素的.可以与context一起使用,用于精确检测选择器查询情况.这两个属性对插件开发人员很有用 实例: <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title> <meta http-equiv='description' content='this is my pag

很容易学习的JQuery库 : (二) 选择器

一.作用 选择器允许您对元素组或单个元素进行操作. 在前面的章节中,我们介绍了一些有关如何选取 HTML 元素的实例. 关键点是学习 jQuery 选择器是如何准确地选取您希望应用效果的元素. jQuery 元素选择器和属性选择器允许您通过标签名.属性名或内容对 HTML 元素进行选择. 选择器允许您对 HTML 元素组或单个元素进行操作. 在 HTML DOM 术语中: 选择器允许您对 DOM 元素组或单个 DOM 节点进行操作. 二.元素选择器 jQuery 使用 CSS 选择器来选取 HT

第一百六十五节,jQuery,过滤选择器

jQuery,过滤选择器 学习要点: 1.基本过滤器 2.内容过滤器 3.可见性过滤器 4.子元素过滤器 5.其他方法 过滤选择器简称:过滤器.它其实也是一种选择器,而这种选择器类似与 CSS3 (http://t.mb5u.com/css3/)里的伪类,可以让不支持 CSS3 的低版本浏览器也能支持.和常规 选择器一样,jQuery 为了更方便开发者使用,提供了很多独有的过滤器. 一.基本过滤器 过滤器主要通过特定的过滤规则来筛选所需的 DOM 元素,和 CSS 中的伪类的语法类 似:使用冒号

jQuery中的选择器深入浅出

随着JavaScript的不断发展,各种各样的为了方便给jQuery变成的库应运而 生,Prototype,YUI,Extjs,bindows,JSVM(国内的),而目前较为流行的是jQuery ,这是一个轻量级的JavaScript库,它的诸多的优点:开源,兼容各种浏览器,继承css ,html,javascript,ajax等,据统计,目前世界上前10000个访问量最高的网站中,有 超过60%都使用的是jQuery,不得不说,在现在的前端界,如果你说你不会jQuery, 那么估计很多人就会对

Jquery简介之选择器

前言 Jquery是一种js框架(程序代码的一种有机结合)是程序开发过程中的一种半成品:类似的框架有EXTJS. 依赖库:jquery-XXX.js 语法:$() 正文 5种基本的选择器 id选择器 $("#id值") 例子:$(#span1).css("color","red"); 标签选择器 $("标签名称") Class选择器 $(".class的值") 群组选择器 $("标签名称1,标签名

Jquery基础之选择器

选择器是JQuery的根基,在JQuery中对事件处理.选择遍历Dom.ajax操作都依赖选择器.JQuery选择器分为基本选择器.层次选择器.过滤选择器.表单选择器. 一.基本选择器 1.ID选择器$("#ID") 页面中每个ID是唯一的,ID选择器选择每个ID元素,如下方法如下:$("#ID");例:$("#tbxName")这个方法选择id=tbxName的页面元素.选择结果为单个元素. 2.类选择器$(".class"