jQuery 遍历 - last() 方法 概述
jQuery 2022-06-01 17:59:21小码哥的IT人生shichen
jQuery 遍历 - last() 方法
实例
高亮显示段落中的最后一个 span :
$("p span").last().addClass('highlight');
完整实例:
<!DOCTYPE html>
<html>
<head>
<style>.highlight{background-color: yellow}</style>
<script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<p><span>Look:</span> <span>This is some text in a paragraph.</span> <span>This is a note about it.</span></p>
<script>$("p span").last().addClass('highlight');</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
定义和用法
last() 将匹配元素集合缩减为集合中的最后一个元素。
语法
.last()
详细说明
如果给定一个表示 DOM 元素集合的 jQuery 对象,.last() 方法会用最后一个匹配元素构造一个新的 jQuery 对象。
请思考下面这个带有简单列表的页面:
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
我们可以对这个列表项集合应用该方法:
$('li').last().css('background-color', 'red');
完整实例:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
<script>
$('li').last().css('background-color', 'red');
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
这次调用的结果是,最后一个项目被设置为红色背景。