博客列表 >jQuery的常用过滤函数-2018年4月3日

jQuery的常用过滤函数-2018年4月3日

笨鸟先飞
笨鸟先飞原创
2018年04月04日 18:20:11390浏览

jquery的常用过滤方法:

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery的常用过滤方法</title>
</head>
<body>
	<ul>
		<li>最新电影01<a href="">点击</a></li>
		<li>最新电影02<a href="">点击</a></li>
		<li>最新电影03<a href="">点击</a></li>
		<li>最新电影04<a href="">点击</a></li>
		<li>最新电影05<a href="">点击</a></li>
		<li>最新电影06<a href="">点击</a></li>
		<li>最新电影07<a href="">点击</a></li>
		<p>开心就好,,对不对!!!</p>
		<li>最新电影08<a href="">点击</a></li>
		<li>最新电影09<a href="">点击</a></li>
		<li>最新电影10<a href="">点击</a></li>
	</ul>
</body>
</html>

<script type="text/javascript" src="jquery/jquery-3.3.1.js"></script>
<script type="text/javascript">
	//过滤方法,也叫过滤函数,大多与前面学过的过滤器是一样的
	//1.get()将jquery对象转为DOM对象
	$('li').get(4).style.color = 'lightpink'

	//2.eq()返回指定索引的元素,返回的是jquery对象
	$('li').eq(3).css('color','lightgreen')

	//3.first()无参数
	$('li').first().css('color','green')

	//4.last()无参数
	$('li').last().css('color','lightgreen')

    

	//5.toArray()返回的是DOM数组
	var li = $('li').toArray()
	for(var i=0;i<li.length;i++){
		li[i].style.color = 'pink'
	}

	//6.find():返回所有后代元素.........找到
	$('ul').find('li').css('color','gray')
	$('ul').find('a').css('color','red')

	//7.children()返回所有的直接子元素
	$('ul').children('p').css('color','pink')

	//8.each(function(){})。。。。。每个
	$('*').removeAttr('style')
	$('li').each(function(){
		$(this).css('color','lightpink')
	})

	// 9.元素遍历
	$('li').removeAttr('style')
	$('li').eq(3).next().css('color','wheat')
	$('li').eq(2).nextAll().css('color','red')

	$('*').removeAttr('style')

	// $('li').eq(4).siblings().css('color','red')

	// $('li').eq(4).prev().css('color','lightgreen')
		$('li').eq(4).prevAll().css('color','lightgreen')

    //10.add()
     $('*').removeAttr('style')
     $('li').add('p').css('color','green')

     //11.slice():从集合中获取一组连续的元素
      $('*').removeAttr('style')
      //不选择最后一个元素
      $('li').slice(2,7).css('color','green')
</script>

运行实例 »

点击 "运行实例" 按钮查看在线实例


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