获取下标跟获取元素的方法:
- index():获取一个元素的下标。
- prev():获取前面一个兄弟元素。
- prevAll():获取前面所有兄弟元素。
- next():获取后面一个兄弟元素。
- nextAll():获取后面所有兄弟元素。
- siblings():获取所有兄弟元素。
代码演示:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="node_modules/jquery/dist/jquery.min.js"></script>
</head>
<body>
<p>hello1</p>
<p>hello2</p>
<p>hello3</p>
<p>hello4</p>
<button>按钮</button>
<p>hello 5</p>
<p>hello 6</p>
<p>hello 7</p>
<p>hello 8</p>
<script type="text/javascript">
$(function () {
$('button').click(function () {
//console.log($(this).prev().html());
//获取当前元素的前一个兄弟元素的html值
//console.log($(this).prevAll('p'));
// 获取当前元素前面的所有为p标签的兄弟元素
//console.log($(this).next().html())
//获取当前元素后面一个兄弟元素的html内容
//获取当前元素后面的所有为p标签的兄弟元素。
//console.log($(this).nextAll('p'));
console.log($(this).siblings('p').index());
//获取当前元素中所有兄弟p的元素,将它们的下标打印出来。
})
})
</script>
</body>
</html>