`
Rainbow702
  • 浏览: 1065180 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类

JQuery 中 :first 选择器的使用注意点

JQueryJavascriptselector选择器:first 
阅读更多 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 	
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function(){
		$("#ee").bind("click", function(){
			$("div:first").attr("id", "test");
			$("#test").append("<button>fffffffffffffffff</button>");
		});
	});
</script>
</head>
<body>
	<button id="ee" >eeeeeeeeee</button>
	<div style="background: red;">
		<button >ddddddddd</button>
		<button >hhhhhhhhh</button>
	</div>
</body>
</html>

 

如果将上面代码中的

$("div:first").attr("id", "test");

更换为

$("div   :first").attr("id", "test");

  

就会发现执行的结果是不一样的，如下面两图：

 

第一种



 
 
 第二种




 
 所以，记得不要把"div:first"分开写，其他类似的选择器也要注意哦！

  • 大小: 2.8 KB
  • 大小: 2.3 KB
分享到：
| JQuery 数组
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jQuery中:first选择器用法实例

    本文实例讲述了jQuery中first选择器用法。分享给大家供大家参考。具体分析如下： 此选择器匹配指定元素集合中的第一个元素。 语法结构: 代码如下:$(“:first”) 在使用中一般要和其他选择器配合使用，比如类选择器...

    jQuery中:first-child选择器用法实例

    本文实例讲述了jQuery中:first-child选择器用法。分享给大家供大家参考。具体分析如下： 此选择器能够匹配父元素的第一个子元素。 语法结构: 代码如下:$(“:first-child”) 此选择器一般也要和其他选择器配合使用，...

    jQuery :first选择器使用介绍

    :first：获取第一个元素，在一些特殊情况下还是蛮实用的，下面为大家详细介绍下:first的具体使用，感兴趣的朋友可以参考下

    浅谈jquery选择器 :first与:first-child的区别

    下面小编就为大家带来一篇浅谈jquery选择器 :first与:first-child的区别。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧

    jQuery位置选择器用法实例分析

    “$基本选择器:位置选择器” 位置选择器种类 常用位置选择器的用法 选择第一个 格式:$(selector:first); 选择最后一个 格式:$(selector:last) 选择奇数 格式:$(selector:odd) 偶数行 格式:$(selector:even)...

    JQUERY选择器　id选择器<br> 2)　　$('.class')　　css选择器,class类名<br>

    #id')　id选择器 2)　$('.class')　css选择器,class类名 3)　$('element')　标签选择器，例如p,h1,div 4)　$('*')　全选择器,可选择所有的html标签...10） $('div:first')　过滤选择器,:first用:与父级元

    jquery 中多条件选择器,相对选择器,层次选择器的区别

    一、Jquery常用的过滤选择器如下所示： 1、:first，选取第一个元素，比如$(“div:first”)选取第一个div元素 2、:last，选取最后一个元素，比如$(“div:last”)选取最后一个div元素 3、:not(选择器)，选取不满足...

    jQuery选择器之基本过滤选择器用法实例分析

    前面一篇介绍了层次选择器，今天我们学习一下jQuery的另一种选择器：基本过滤选择器。过滤选择器可以过滤掉自己不想要的东西，也就是说过滤后留下的都是自己需要的。jQuery过滤选择器就是通过特定的过滤规则来筛选出...

    CSS3伪类选择器；例如：E:root、E:not等等

    E:not 否定选择器，它和JQuery中的:not选择器一模一样，可以选择除某个元素以外的元素， E:first-child 第一个子元素 ,表示给指定元素的父元素中的第一个指定元素设置一个统一的样式，E表示指定元素 E:last-child...

    jQuery过滤选择器用法分析

    1. :first选择器 格式: 代码如下:$(“selector: first”)用于对当前jQuery集合进行过滤并选择出第一个匹配元素 实例: 代码如下:$(“td:first”).css(“border”, “2px solid blue”); 2. :last选择器 格式: 代码...

    jQuery基本过滤选择器用法示例

    主要介绍了jQuery基本过滤选择器用法,结合实例形式分析了jQuery中:first、:last、:not、:even、:odd、:eq、:gt等基本过滤选择器的使用方法,需要的朋友可以参考下

    jQuery子属性过滤选择器用法分析

    本文实例讲述了jQuery子属性过滤选择器用法。分享给大家供大家参考。具体分析如下： 1. :first-child选择器 用于选择其父级的第一个子元素的所有元素，格式: 代码如下:$(“selector:first-child”) 如： 代码如下:$...

    jQuery子选择器与可见性选择器实例分析

    本文实例讲述了jQuery子选择器与可见性选择器。分享给大家供大家参考，具体如下： 子元素选择器与可见性选择器 子元素选择器是允许利用子元素的位置进行获取的选择器 子内容选择器3种用法 E:first-child 选择所有...

    JQuery新版中文手册

    选择器 基本 #id element .class * selector1,selector2,selectorN 层级 ancestor descendant parent &gt; child prev + next prev ~ siblings 基本 :first :last :not(selector) :even :odd :eq...

    jQuery 1.4.1 中文参考

    3. 选择器 37 3.1 基本 37 3.1.1 #id 37 3.1.2 element 38 3.1.3 .class 38 3.1.4 * 39 3.1.5 selector1,selector2,selectorN 39 3.2 层级 40 3.2.1 ancestor descendant 40 3.2.2 41 3.2.3 prev + next 41 3.2.4 ...

    jquery子元素过滤选择器使用示例

    代码如下: :nth-child(‘索引值’)//获取指定元素下的某个子元素的位置，索引从1开始；... //$(‘li:first-child’).addClass(‘class1’); //只有1个子元素 $(‘li:only-child’).addClass(‘class1’);

Magicbox
Global site tag (gtag.js) - Google Analytics