如何才能取到下面这个值

Question

这选择器看着都头大，尽量选择器别弄这么复杂，后期维护也很麻烦吧，有2个的话那$('div.m_con.m_jk div:visible div.m_progress.progress1 .num').length应该是2吧，难道直接这样$('div.m_progress_start').text()这样取不行？

Answer 1

前面1个是<div style="display: block"> 后面1个 <div style="display: none">，我想取display: block的

Answer 2

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type='text/javascript'>
$(function(){
$(".m_jk_c table div:visible .m_progress_cursor_title span").each(function(){
alert($(this).text());
})
})
</script>
<div class="m_con m_jk">
 <div id="tab1">
 <div class="m_jk_c m_tab_c">
 <div style="display: block" number="0">
 <table>
 <tr>
 <td class="wd1"><span class="m_ico2_1"></span></td>
 <td class="td1"></td>
 <td colspan="4">
 <div class="m_progress progress1">
 <div class="m_progress_start">500</div>
 <div class="m_progress_range">
 <div class="m_progress_percent_bg">
 <div class="m_progress_percent"></div>
 </div>
 <div class="m_progress_cursor"></div>
 <div class="m_progress_cursor_title">
 <span class="num">100</span>
 <div class="corner"></div>
 </div>
 </div>
 <div class="m_progress_end">3000</div>
 </div>
 </td>
 </tr>
 </table>
 </div>
 <div style="display: none" >
 <table>
 <tr>
 <td class="wd1"><span class="m_ico2_1"></span></td>
 <td class="td1"></td>
 <td colspan="4">
 <div class="m_progress progress1">
 <div class="m_progress_start">100</div>
 <div class="m_progress_range">
 <div class="m_progress_percent_bg">
 <div class="m_progress_percent"></div>
 </div>
 <div class="m_progress_cursor"></div>
 <div class="m_progress_cursor_title">
 <span class="num">1000</span>
 <div class="corner"></div>
 </div>
 </div>
 <div class="m_progress_end">3000</div>
 </div>
 </td>
 </tr>
 </table>
 </div>
 </div>
 </div>
 </div> 

Answer 3

能否指定是m_progress progress1下的，因为有多个我没有全列出来？

Answer 4

$('div.m_con.m_jk div.m_progress.progress1 .num:visible').text()

Answer 5

text取值的时候
一定要确保对于的dom元素有仅有一个（除非你有其它用途）

Answer 6

这样最好定义个class来控制，直接用div:visible这样子选择有些浏览器貌似会有问题。