jQuery获取当前元素兄弟元素简单介绍

当前位置：首页 > 代码实例 > html5 css3代码分类 > jQuery > jQuery获取当前元素兄弟元素简单介绍

在实际应用中，有时候要获得当前元素的兄弟元素，下面就通过一段实例代码简单介绍一下如何获取当前元素的兄弟元素。
实例代码如下:

[ jQuery ] 运行代码下载代码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="https://www.51qianduan.com/" /> 
<title>51前端</title> 
<style type="text/css"> 
#box{
  margin:50px;
}
a { 
  display:block; 
  width:100px; 
  height:30px; 
  line-height:30px; 
  text-align:center; 
  background-color:#66F; 
  margin-top:5px; 
  text-decoration:none; 
} 
</style> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>   
<script type="text/javascript">  
$(document).ready(function(){
  $("a").click(function(){
    $(this).css("background-color","red");
    $(this).siblings().css("background-color","#66F");
  })
})
</script> 
</head> 
<body> 
<div id="box"> 
  <a href="#">51前端一</a>
  <a href="#">51前端二</a>
  <a href="#">51前端三</a>
  <a href="#">51前端四</a>
  <a href="#">51前端五</a>
</div> 
</body> 
</html>

代码描述：jQuery获取当前元素兄弟元素。jQuery获取当前元素兄弟元素简单介绍

下载全部收藏

161 215

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册