javascript - jQuery 按类选择最接近的子元素

Question

我如何使用 jQuery 从 id=overall answer div 中选定的评级 div 中获取文本？

我想从整个父 div 内的该 div 动态获取文本“TESTING”。

<div class='answer' id="overall">
      <div class='rating'>1</div>
      <div class='rating'>2</div> 
      <div class='rating'>3</div>
      <div class='rating'>4</div>
      <div class='rating selected'>TESTING</div>
</div>

<div class='answer' id="effort">
      <div class='rating'>1</div>
      <div class='rating'>2</div> 
      <div class='rating'>3</div>
      <div class='rating selected'>4</div>
      <div class='rating'>TESTING</div>
</div>

我尝试这样做，但它是空白的。

$(document.getElementById('overall')).find('.rating selected').text();

Answer 1

您的代码可以工作，但您的选择器是错误的。这将是...

$(document.getElementById('overall')).find('.rating.selected').text();

请注意评级和所选之间的点且没有空格。

但是，我认为你把事情复杂化了......

$('#overall .selected').text();

示例...

alert($('#overall .selected').text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<div class='answer' id="overall">
      <div class='rating'>1</div>
      <div class='rating'>2</div> 
      <div class='rating'>3</div>
      <div class='rating'>4</div>
      <div class='rating selected'>TESTING - selected</div>
</div>

<div class='answer' id="effort">
      <div class='rating'>1</div>
      <div class='rating'>2</div> 
      <div class='rating'>3</div>
      <div class='rating selected'>4</div>
      <div class='rating'>TESTING - not selected</div>
</div>