1.next()方法获取节点之后的第一个同辈元素
$((function(){$("div").click(function() {alert($(this).next().text());})}));
选择过滤器
$(".men").next("div")
nextAll()方法用于获取节点后的所有同辈元素,同样可以加过滤器
示例:被点击的div 下面所有的div 的背景变红
$("div").click(
function () {
$.each($(this).nextAll("div"),function () {$(this).css("background","red")});
});
2.siblings()方法用于获取所有同辈元素
$(".men").siblings("li")
示例:当点击div 他自己css样式背景变红 ,他的兄弟div的样式背景变白(高亮显示的原理)
$("div").click(
function () {
$(this).css("background", "red"); $(this).siblings("div").css("background", "white");
});
中间部分可简写为$(this).css("background","red").siblings("div").css("background", "white");
3.应用:星级评分
取得元素初始状态都是“空” 当鼠标移动某个指定元素下触发以下事件 1.所有元素”满“ 2.鼠标移上去的 元素的下面符合要求的元素都变成”空“
$("#re td").html("☆").mouseover(function () { $("#re td").html("★"); $(this).nextAll().html("☆"); });