Javascript 选择当前目标上的元素

我知道这很容易，但我想不出来

<ul class="footer_nav">
    <span class='footer_header'>01</span>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
</ul>

<ul class="footer_nav">
    <span class='footer_header'>01</span>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
</ul>

但是，使用此选项，您如何在当前UL中选择另一个可以更新但仅在当前UL（而不是所有跨度）中更新的元素

Here is my current coffeescript...

  $('ul.footer_nav').hover (e) ->
    changeFooterHover(e)


##functions
  changeFooterHover = (e) ->
    span = e.currentTarget.parentNode.getElementsByTagName('span')
    span.toggleClass("selected");

带着错误

Uncaught TypeError: Object #<NodeList> has no method 'toggleClass' 

---

您可以找到跨度：

var elem = document.getElementsByClassName('footer_header')[0];

…或使用jQuery：

var elem = $(this).closest('ul').find('.footer_header');

---

如果您使用的是jQuery，则可以按如下方式执行：

$("ul li a").mouseenter(function(e){
    var anchorElt = $(this);
    anchorElt.parent().parent().find("span").text(anchorElt.text());
});

当然，如果html中有多个ul元素，如果没有，则可以从ul元素中找到跨度并更改值。

您需要：

这将帮助您停止外部元素上的冒泡事件

您可以使用.closest函数获取所需的UL元素

    $( 'li a' ).hover( function() {
        $( this ).closest( 'ul' ).find( 'span' ).html( 'over' );
    },
    function() {
        $( this ).closest( 'ul' ).find( 'span' ).html( 'out' );
    });

---

类似上面的内容可能会帮助您走上正确的道路。

当li.a上发生悬停事件时，您指的是什么。我更改了.span的CSS值，但仅在currentTarget中更改。如果您想在ul中获取不同的元素，那么可以使用e.currentTarget.parentNode来获取ul元素，然后使用诸如getElementsByTagName之类的东西。这取决于你想要什么和你已经在做什么。发布一些Javascript代码！我添加了一些代码，请你取消投票我的帖子为什么取消投票？您可以使用.closest函数并执行开始时要求的操作。

    $( 'li a' ).hover( function() {
        $( this ).closest( 'ul' ).find( 'span' ).html( 'over' );
    },
    function() {
        $( this ).closest( 'ul' ).find( 'span' ).html( 'out' );
    });