如何获得表格的特定div?

时间:2013-07-11 08:17:14

标签: javascript html html-table row

我有一个如下表,有9行。从第二行开始,行内容的格式相同。

我的要求是我必须遍历第二行到最后一行,并且在每一行中我应该能够为第三行设置文本(<div class="homeLeftPaneText">want to set the text here </div>

<table id="__table1-table" >
   <tbody>
      <tr role="row" >
         <th aria-owns="__column1" aria-labelledby="__column1" style=""></th>
     </tr>

      <tr id="__table1-rows-row0" class="">
         <td id="__table1-rows-row0-col0" role="gridcell" aria-labelledby="__table1-ariadesc __column1 __html1-col0-row0" >
            <div >
               <div class="homeLeftPaneRow" data-sap-ui-preserve="__html1-col0-row0" id="__html1-col0-row0">
                  <div class="homeLeftPaneIcon homeLeftPaneStartIcon"> </div>
                  <div class="homeLeftPaneText"> Getting Started</div>
                  <div class="homeLeftPaneText">want to set the text here </div>
               </div>
            </div>
         </td>
      </tr>

    <tr >
        //same format as  in __table1-rows-row0
    </tr>

   <tr id="__table1-rows-row4" >

   </tr>
   <tr id="__table1-rows-row4" >
          //same format as  in __table1-rows-row0            
   </tr>
   <tr id="__table1-rows-row4" >
          //same format as  in __table1-rows-row0            
   </tr>

    <tr id="__table1-rows-row4" >
          //same format as  in __table1-rows-row0            
   </tr>

    <tr id="__table1-rows-row4" >
          //same format as  in __table1-rows-row0            
   </tr>

    <tr id="__table1-rows-row4" >
          //same format as  in __table1-rows-row0            
   </tr>
   </tbody>
</table>

2 个答案:

答案 0 :(得分:2)

这里的一个问题是没有两个DOM元素应该具有相同的id。改为使用一个类。

你想要做的是,在为所有那些表行分配适当的类之后,使用jQuery来获取类的每个实例,找到你想要的div(你需要为那组div分配一个唯一的类),然后修改它。

所以它看起来像

$(".__table1-rows-row4").find(".modifythis").html("new text here");

将适当的类附加到需要更改的div后

答案 1 :(得分:0)

如果你只修改那个div并且所有这些div的内容都是相同的,你可以只为该div添加一个类,例如“setTextHere”,然后将文本修改为:

$(".setTextHere").html("New Text");

如果这些第三个div中的每一个的文本都不同,那么您将必须找到相应的父元素。在这个例子中,N是行数。

$("#__table1-rows-rowN").find(".setTextHere").html("Text for Row N");