SOURCE

const list= [{
      id: 1,
      name: '技术1',
      status: 1
    },
    {
      id: 2,
      name: '技术2',
      status: 2
    },
    {
      id: 3,
      name: '技术3',
      status: 3
    },
    {
      id: 4,
      name: '技术4',
      status: 4
    }]
const _tbody = document.getElementById('tbodys')
const _btn = document.getElementsByClassName('btn-primary')[0]
function CH_DOM(dom){
  let _dom = ''
  dom.map((item,index)=>{
    _dom += `<tr>
			<th>${index}</th>
      <td>${item.id}</td>
			<td>${item.name}</td>
      <td>${item.status}</td>
		</tr>`
  })
  _tbody.innerHTML = _dom
}
CH_DOM(list)
_btn.onclick = function(){
  change()
}
 function change(){
   console.log('change')
   const _list = [{
      id: 1,
      name: '技术1',
      status: 1
    },
    {
      id: 2,
      name: '技术2',
      status: 2
    },
    {
      id: 3,
      name: '技术3',
      status: 3
    },
    {
      id: 4,
      name: '技术4',
      status: 4
    },{
      id: 5,
      name: '技术5',
      status: 5
    }]
  CH_DOM(_list)
 }
setTimeout(()=>change(),3000)
                 

<div id="app">
  <div class="container">
    <div class="row m-3">
      <table class="table">
        <thead>
          <tr>
            <th scope="col">
              #
            </th>
            <th scope="col">
              id
            </th>
            <th scope="col">
              name
            </th>
            <th scope="col">
              status
            </th>
          </tr>
        </thead>
        <tbody id="tbodys">
        </tbody>
      </table>
    </div>
  </div>
</div>
<button type="button" class="btn btn-primary">修改DOM</button>

@import 'https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css'