实际上是由您根据页面上下文决定使用什么选择器来寻址colspanned TD。它应该是独一无二的。我已经选择了它在你的TR与foodtablesupper属性。
您的示例中没有足够的环绕标记。

更新

根据作者的要求，编辑代码以解决可能的几个TD。

document.querySelector('button').addEventListener('click', () => {

  document.querySelectorAll('tr[foodtablesupper] > td.subheader').forEach(td => td.setAttribute('colspan', 4));

});

td{
  min-width:50px;
  background:#aaa;
  text-align:center;
}
table{
  border-spacing: 3px;
}
td.subheader{
  background: yellow;
}

<table>
<tr foodtablesupper>
  <td class="subheader" colspan="3">
    Upper Floor
  </td>
</tr>
<tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>
</table>
<hr/>
<button>Make 4 colspan</button>