javascript - 如何使用 jQuery 获取后代 span 元素？

Question

我有以下 HTML:

<a href="javascript:search_rate(this, 'key', 'upvote', 'url' );">
    <div>
        <span class="glyphicon glyphicon-thumbs-up"></span> <span class="rating">0</span>
    </div>
</a>

在函数 search_rate 中，我想使用我传递的 this 变量来获取带有 class="rating"的元素，然后将其值从 0 更新为 1。我正在使用 jQuery 并编写了以下代码来尝试获取元素:

update_node = $(this).find('.rating');

但是，出于某种原因，update_node 没有指向正确的 DOM 元素。只是为了澄清我是一个初学者，并且一直在努力研究如何使用 jQuery 来导航 DOM。非常感谢您的帮助，谢谢!

Answer 1

如果您要使用 jQuery，则不需要通过 href 传递函数。您根本不需要使用 a 标记。只需定位点击的 div 并更新其子级 .rating

HTML

<div class="upvote">
    <span class="glyphicon glyphicon-thumbs-up"></span> 
    <span class="rating">0</span>
</div>

JS

$(".upvote").click(function(){
   $(this).find(".rating").html("1");    
});

EXAMPLE 1

注意:如果你想做一个投票计数系统，我会在页面加载时提取数字并在点击时加 1:

//pull current number
var currentCount = $(".upvote .rating").text();

$(".upvote").click(function(){ 
  $(this).find(".rating").html(parseInt(currentCount)+1); 
});

EXAMPLE 2

更新

要将其他值传递给点击事件，只需将它们添加为数据属性即可:

<div class="upvote" data-one="hello" data-two="goodbye">

EXAMPLE 3