博客列表 >jquery的选择函数

jquery的选择函数

魏先生的博客
魏先生的博客原创
2018年04月22日 18:14:28703浏览
<ul>
			<li><a>1111111111111111111111111111111111111111111</a></li>
			<li><a><span>222</span>2222222222222222222222222222222222222222</a></li>
			<li><span>3333333333333333333333333333333333333333333</span></li>
			<li>4444444444444444444444444444444444444444444</li>
			<li>5555555555555555555555555555555555555555555</li>
			<li style="color: blue;">6666666666666666666666666666666666666666666</li>
			<p>77777777777777777777777777777777777777777777777</p>
		</ul>
		<script>
			//1.get:返回jqery的DOM对象,跟写css一个道理
			//$('li').get(1).style.color='red';
			
			//2.eq():获取当前序号的元素,比如eq(0);eq(1)等等
			//$('li').eq(3).css('background','red');$('li').eq(3).css('color','white');
			
			//3.first:选择第一个来定义
			//$('li').first().css('color','red');//第一
			//$('li').last().css('color','red');//最后
			
			//4.toArray(),返回DOM数组,注意不是jquery对象
//			var li = $('li').toArray()
//			for(i=0;i<li.length;i++){
//				li[i].style.color='red';
//			}

            //find():返回所有的后代元素包括子孙
            //$('ul').find('li').css('color','red');
			//$('ul').find('a').css('color','red');
			
			//children():参数可加可不加 返回所有的直接子元素
			//$('ul li').children('a').css('color','blue');
			
			//each():逐个遍历
//			$('li a').each(function(){
//				$(this).css('color','white');
//				$(this).css('background','blue');
//				$(this).css('font-size','1.5em');
//			})

            //next():遍历下一个同级元素
//          $('ul li').eq(1).next().css('color','red');//遍历同级元素
//			//nextAll():遍历选定后的所有同级元素
//		    $('ul li').eq(1).nextAll().css('color','red');//遍历选定后的同级所有元素
//			
//			//siblings():遍历所有的元素,除了他自己不遍历
//			$('li').eq(2).siblings().css('color','yellow');
			
//			//prev返回上一个元素
//			$('li').eq(1).prev().css('color','red');
//			//prevAll遍历前面所有的元素
//			$('li').eq(4).prevAll().css('color','red');
//			//removeattr()删除元素里的样式
//			$('li').last().removeAttr('style');
//			//*号可以选定所有
//			//p元素不在li标签里,需要添加他的话,就用add()就可以了,很吊
//			$('*').removeAttr('style');
//			$('li').css('color','red');
//			$('li').add('p').css('color','red');
			
			//filter()返回正常的
			//$('li').filter(':eq(4)').css('background-color','blue');
			
			//not()和filter正好相反的
			//$('li').not(':eq(4)').css('background-color','blue');//等于取反
			
			//slice() 返回指定范围内的元素
//		$('li').removeAttr('style');
//			
//			$('li').slice(2,5).css('color','red')//第二个到第五个元素
//			
//			//省掉一个参数,就是从当前位置到最后的元素
//			$('li').slice(4).add('p').css('color','red');
		</script>


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议