js中通过父级进行查找的解决办法

来源：互联网发布：计算机二级考试软件编辑：程序博客网时间：2024/05/29 14:13

<ul id=“newslist”><li>  <span class="fr w160 tl">2013-06-24</span>    <span class="news_list_icon fl mr8 icon" ></span>    <span class="fl"><a href="{href}"  onmouseover="javascript:changeReadIconOver(this);" onmouseout="javascript:changeReadIconOut(this);">身体健康，万事如意</a></span>'</li></ul>

如果想要查找到有icon这个class的span（对其进行操作，将news_list_icon换为news_list_icon_hover），除了用原始的代码

$("#newslist li").hover(function(){    $("#newslist li").find(".icon").addClass("news_list_icon_hover")    },function（）{        $("#newslist li").find(".icon").removeClass("news_list_icon_hover")       }    );

还可以用父级查询的方法进行定位，具体如下：

function changeReadIconOver(alink) {            $(alink).parent().parent().find(".icon").addClass("news_list_icon_hover");        }        function changeReadIconOut(alink) {            $(alink).parent().parent().find(".icon").removeClass("news_list_icon_hover");        }

$(alink).parent(): 指的是<span class="fl">这个标签
$(alink).parent().parent(): 指的是<li>这个标签$(alink).parent().parent().find(".icon"): 就可以定位到想要的元素了