在使用jQuery处理Web页面元素时，我们经常会遇到需要在同级元素之间获取或设置值的情况。本文将介绍如何在特定场景下，如在GridView中，使用jQuery取同级值。
### jQuery同级元素值获取方法
1. **使用.next()方法获取下一个兄弟元素的值**
在jQuery中，`.next()`方法可以用来选取匹配元素集合中每个元素紧邻的同级元素。例如，当页面上有一个checkbox被选中时，我们可能需要获取紧接着该checkbox后面隐藏字段的值。
```javascript
customerCode=$("input:checked").next().attr("value");
```
上述代码中，`$("input:checked")`找到所有选中的checkbox，`.next()`取得紧接着checkbox的下一个兄弟元素（即隐藏字段），`.attr("value")`获取该元素的值。
2. **使用.next().next()方法获取更后一个同级元素的值**
如果你需要获取选中checkbox之后的第二个同级元素的值，可以连续调用两次.next()方法。
```javascript
//customerName=$("input:checked~#hdCustomerName").val();
type=$("input:checked~.hdStatus").attr("value");
```
在此例中，注释部分的代码由于IE浏览器对于ID选择器的限制而不能使用，因此改用class选择器`.hdStatus`结合`.attr("value")`获取值。
### jQuery全选/取消全选实现
另一个常见的场景是全选/取消全选checkbox的功能。
```html
<input type="checkbox" name="chk_list" id="chk_list_1" value="1"/>1<br/>
<input type="checkbox" name="chk_list" id="chk_list_2" value="2"/>2<br/>
<input type="checkbox" name="chk_list" id="chk_list_3" value="3"/>3<br/>
<input type="checkbox" name="chk_list" id="chk_list_4" value="4"/>4<br/>
<input type="checkbox" name="chk_all" id="chk_all"/>全选/取消全选
<script type="text/javascript">
$("#chk_all").click(function(){
$("input[name='chk_list']").attr("checked",$(this).attr("checked"));
});
</script>
```
以上代码中，当点击全选checkbox（#chk_all）时，会触发点击事件处理函数。在该函数内部，使用jQuery的`.attr()`方法将`"checked"`属性设置为与`#chk_all`的当前选中状态相同，从而实现全选或取消全选的功能。
### jQuery.attr()方法的使用
`.attr()`方法是jQuery中用于获取和设置元素属性值的方法。
```javascript
$("input").attr("value");
```
这行代码获取页面上所有`<input>`元素的`value`属性值。而`.attr("checked")`可以用来判断checkbox是否被选中。在实现全选功能时，`.attr()`方法被用来设置`checked`属性：
```javascript
$("input[name='chk_list']").attr("checked",$(this).attr("checked"));
```
这段代码将所有`name`为`chk_list`的checkbox的`checked`属性设置为与`#chk_all`复选框的`checked`状态一致。
通过上述知识，我们可以看到如何利用jQuery来处理同级元素之间的交互以及如何使用jQuery的属性选择器和方法来实现Web页面的动态交互功能。在实际应用中，这可以帮助开发者更高效地操作DOM，提升用户体验。
