JS, jQuery - board 만들기

Jiwontwopunch·2021년 12월 29일
0

TIL

목록 보기
17/92
post-thumbnail
<script>
  const list = [
  {no:5, title:'취업 고민', writer:'spring', read:11},
  {no:4, title:'메이플 스토리', writer:'summer', read:21},
  {no:3, title:'루키', writer:'spring', read:15},
  {no:2, title:'산업의 과제', writer:'winter', read:30},
  {no:1, title:'민폐 영상', writer:'winter', read:22}
  ];
  $(document).ready(function(){
   const $list = $('#list');
   for(board of list){
    const $tr = $('<tr>').appendTo($list);
    $('<td>').text(board.no).apeendTo($tr);
    const $td = $('<td>').appendTo($tr);
    $('<a>').attr('htrf','#').text(board.title).appendTo($td);
    $('<td>').text(board.writer).appendTo($tr);
    $('<td>').text(board.read).appendTo($tr);
 }
});
</script>
</head>
<body>
  <table>
    <thead>
      <tr>
        <th>번호</th>
        <th>제목</th>
        <th>글쓴이</th>
        <th>조회수</th>
      <tr>
    </thead>
    <tbody id='list'>
    </tbody>
  </table>
</body>

위의 코드에서 기억해야 할 코드 부분은

    const $td = $('<td>').appendTo($tr);
    $('<a>').attr('htrf','#').text(board.title).appendTo($td);

0개의 댓글