程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> javascript-關於JS,JQ循環添加問題!!!聖誕快樂大神

javascript-關於JS,JQ循環添加問題!!!聖誕快樂大神

編輯:編程綜合問答
關於JS,JQ循環添加問題!!!聖誕快樂大神

不如我有一塊代碼

 <table>
     <div id="div0">
        <tr>
            <td id="num0">學號</td>
            <td id="class0">班級</td>
            <td id="name0">姓名</td>
            <td id="age0">年齡</td>
        </tr>
     </div>
 </table>

現在我想將 div0 這一塊代碼 循環添加
根據我傳入的list.length的值,添加相應的個數。
並且使 div0-->divn 、 num0--->numn ..等等自增
並影藏每一行的學號!
改如何做?
JS JQ都可以。

最佳回答:


 <!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
var table;
$(document).ready(function(){
   table = $('table');
   rows = [
    {xh:"學號0",bj:"班級0",na:"名字0",age:"年齡0"}
    ,{xh:"學號1",bj:"班級1",na:"名字1",age:"年齡1"}
    ,{xh:"學號2",bj:"班級2",na:"名字2",age:"年齡2"}
    ,{xh:"學號3",bj:"班級3",na:"名字3",age:"年齡3"}
   ]
   addRows(table,rows);
});

function addRows(table,rows){
  for(var i=0;i<rows.length;i++){
     var row = rows[i];
     var divEle= $('<div id="div'+i+'"></div>');
     var trEle = $('<tr></tr>');
     var tdEleHtml ='<td id="num'+i + '" style="display:none">'+row.xh+'</td>'
            +'<td id="class'+i+'">'+row.bj+'</td>'
            +'<td id="name'+i+'">'+row.na+'</td>'
            +'<td id="age'+i+'">'+row.age+'</td>';
     var tdEles = $(tdEleHtml);
     trEle.append(tdEles);
     divEle.append(trEle );
     table.append(divEle);
  }
}
</script>
</head>
<body>
<table>
 </table>
</body>
</html>

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved