js中通过父级进行查找定位元素

2019-12-21,,,,

复制代码 代码如下:
<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"): 就可以定位到想要的元素了

您可能感兴趣的文章:

  • JavaScript实现在数组中查找不同顺序排列的字符串
  • JS实现线性表的顺序表示方法示例【经典数据结构】
  • JavaScript数据结构之二叉树的查找算法示例
  • js基本算法:冒泡排序,二分查找的简单实例
  • JavaScript黑洞数字之运算路线查找算法(递归算法)实例
  • js实现的二分查找算法实例
  • JavaScript使用二分查找算法在数组中查找数据的方法
  • javascript下查找父节点的简单方法
  • JS查找字符串中出现次数最多的字符
  • javascript实现二分查找法实现代码
  • js查找节点的方法小结
  • 基于JavaScript实现的顺序查找算法示例

《js中通过父级进行查找定位元素.doc》

下载本文的Word格式文档,以方便收藏与打印。