javascript - 如何在每个 html 元素上运行每个元素

Question

我在 div 中有一个 html 表，我想在每个 li 元素或 li 类上运行 jquery并提醒他的ID。

这是 html 代码。这是 html 代码。

HTML:

    <div id="lightbox_tlbr" style="top: 273px; display: block;">
   <div id="test">
      <div class="header_div" id="first_header"></div>
      <div class="header_div" id="second_header"></div>
      <div class="header_div" id="third_header"></div>
      <div class="header_div" id="fourth_header"></div>
   </div>
   <li class="announcement_tlbr" id="announcement7">
      <table id="tg_toolbar7" class="tg_toolbar">
         <tbody>
            <tr style="background-color:#3E3E3E;" class="tg_text0" id="tg_text07">
               <th style="background-image:url(/srv/admin/img/announcement/general_message_icon.png);" rowspan="2" class="tg-031etoolbar" id="tg_text17"></th>
               <th colspan="2" style="background-color:green" class="title_style_toolbar" id="tg_text27"><a style="color:white;font-size:11px;">2014-03-27 10:36:25</a><br><a style="color:white;">Title - 6 test</a><a></a></th>
               <td style="width:0px;background-color:green;" id="tg_text87"><input type="button" class="minimze" style="background-color:green;background:url(/srv/admin/img/announcement/minimise_button.png);float:right;" id="minimze7"></td>
            </tr>
            <tr id="tg_text97">
               <td colspan="2" class="tg_text" id="tg_text37"></td>
            </tr>
            <tr class="r2_toolbar" id="tg_text47">
               <td class="tg_toolbar-031e" style="background-color:#3E3E3E;" id="tg_text57"></td>
               <td class="tg_toolbar-031e" id="tg_text67"></td>
               <td class="tg_toolbar-031e" id="tg_text77"><input type="button" value="Confirm" class="ajax_btn_right_toolbar" id="button7"><input type="checkbox" class="ajax_checkbox_toolbar" id="checkbox7"></td>
            </tr>
         </tbody>
      </table>
   </li>
   <li class="announcement_tlbr" id="announcement5">
      <table id="tg_toolbar5" class="tg_toolbar">
         <tbody>
            <tr style="background-color:#3E3E3E;" class="tg_text0" id="tg_text05">
               <th style="background-image:url(/srv/admin/img/announcement/bug_icon.png);" rowspan="2" class="tg-031etoolbar" id="tg_text15"></th>
               <th colspan="2" style="background-color:red" class="title_style_toolbar" id="tg_text25"><a style="color:white;font-size:11px;">0000-00-00 00:00:00</a><br><a style="color:white;">Title - 4 test</a><a></a></th>
               <td style="width:0px;background-color:red;" id="tg_text85"><input type="button" class="minimze" style="background-color:red;background:url(/srv/admin/img/announcement/minimise_button.png);float:right;" id="minimze5"></td>
            </tr>
            <tr id="tg_text95">
               <td colspan="2" class="tg_text" id="tg_text35"></td>
            </tr>
            <tr class="r2_toolbar" id="tg_text45">
               <td class="tg_toolbar-031e" style="background-color:#3E3E3E;" id="tg_text55"></td>
               <td class="tg_toolbar-031e" id="tg_text65"></td>
               <td class="tg_toolbar-031e" id="tg_text75"><input type="button" value="Confirm" class="ajax_btn_right_toolbar" id="button5"><input type="checkbox" class="ajax_checkbox_toolbar" id="checkbox5"></td>
            </tr>
         </tbody>
      </table>
   </li>
   <div align="left" class="footer">Please confirm you have read and acted upon this message</div>
</div>

我尝试:

jQuery.each(".announcement_tlbr", function(k,v){  alert(k); })

有什么好的方法可以做到这一点？

Answer 1

你应该在每个元素中使用this来获取当前元素的引用。试试这个:

jQuery.each(".announcement_tlbr", function(e){
  alert($(this).attr('id'));//or this.id 
});