javascript - jQuery 在 h 标签内查找元素。使用哪个 DOM 选择器？

Question

我在 h 标签中有一个图标:

<h4 class="ipro_toggle"><i class="fa fa-chevron-down fa-rotate-270 pull-left toggle_icon"></i>Click Me</h4>

我试图在单击 h4 时切换类 fa-rotate-270。一个页面上会有多个这样的元素。

    $("h4.ipro_toggle").click(function(){
    $(this).next(".toggle_icon").toggleClass("fa-rotate-270 norotate");
});

这是找不到图标。我应该使用什么 DOM 选择器？

Answer 1

有几种方式:

$(this).children('.toggle_icon').toggleClass('fa-rotate-270 norotate');

或

$(this).find('.toggle_icon').toggleClass('fa-rotate-270 norotate');

或

$('.toggle_icon', this).toggleClass('fa-rotate-270 norotate');

您使用的方法 ( next ) 在此处无效，因为 .toggle_icon不是被点击的 <h4> 的下一个 sibling 元素，但它的后代。