整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
、遇問題：
產品說：“這里有幾十個頁面你全都加上固定表頭?！?/p>
我（上次加一個頁面花了我N++個小時，又來十幾個！！?。骸昂玫??！?/p>
產品說：“今天能弄出來嗎？”
我（OOXXXXXX，）：“我試試哈”
產品：“加油！”
經理：“+1”
老板：“+1”
二、解決思路：
1.上一篇文章介紹到使用css來固定表頭，但是太復雜了，不能短時間復制到多張表使用
2.只能祭出大招引用第三方Js了哈哈。
三、偽代碼
引入js、css
<script src="http://www.jq22.com/jquery/1.7.2/jquery.min.js"></script>
<script src="jquery.fixedheadertable.js"></script>
<link href="defaultTheme.css" rel="stylesheet" media="screen" />
<link href="myTheme.css" rel="stylesheet" media="screen" />
jquery.fixedheadertable.js (我加了中文注釋，感興趣可以到我github上下載)
defaultTheme.css、fixedheadertable.js這兩個就不要動了
只需要需改myTheme.css，這個是自己美化頁面的樣式哦
<div class="grid_8 height250">
<table class="fancyTable" id="myTable01" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>公司/日期</th>
<th>2018-07-20</th>
<th>2018-07-21</th>
<th>2018-07-22</th>
<th>2018-07-23</th>
<th>2018-07-24</th>
</tr>
</thead>
<tbody>
<tr>
<td >群鑫</td>
<td>67.9%</td>
<td >64.8%</td>
<td>67.5%</td>
<td >71.5%</td>
<td>78.1%</td>
<td >79.8%</td>
<td>71.9%</td>
<td >72.6%</td>
<td>72.1%</td>
</tr>
</tbody>
</table>
</div>
<script>
$('#myTable01').fixedHeaderTable({ footer: true, cloneHeadToFoot: true, altClass: 'odd', autoShow: false });
</script>
就這么簡單
演示地址：
[演示地址](http://47.105.36.188:3030/toutiao/JS實現的Table表頭固定/index.html)
[源代碼下載](https://github.com/harryluo163/toutiao/tree/master/JS實現的Table表頭固定)
頁中實現像表格文檔那樣固定table的表頭和第一列內容，類似于excel表格那樣！下面說說實現方法
效果如下：
在數據眾多的列表下，規定的區域內上下左右都可以滾動查看，然而表頭和側邊表頭都還在，方便用戶查看數據，增強用戶體驗！
實現代碼
html結構：
css代碼：
javascript代碼：
、如何將繪制好的表格做到下面的要求？
1、給表格添加標題，只需要在 table 標簽內的第一行添加 標簽即可，例如下面
如果想要加粗標題字體，可以在 標簽內嵌套一個 標題標簽例如：課程表
表頭字體加粗的方法就是將原來的 td 標簽換成 th 標簽，然后就加粗了。
那么同理，想要哪個單元格的字體加粗，就將 td 標簽換成 th 標簽即可。
注意事項：繪制表格過程中，不是將文字寫在 table 標簽內就是在表格里了，而是要使用相應的表格標簽包含了才行。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
