任務2 斑馬線表格制作

2.1 任務導入

表格行較少時，可以直接定義樣式表實現斑馬線表格，但當表格行較多或者后臺生成表格行數不確定時，或者是行可能隨時增刪的表格，再或者表格需要響應交互事件時，手動設置表格類樣式和修改樣式，工作量巨大且效率低下，使用CSS3的高級選擇器:nth-child（）會存在瀏覽器兼容性問題。JavaScript特別擅長處理重復性任務，能實現比樣式表更為豐富的DOM操作。一般當表格第一行有背景色時，從第三行設置背景色；第一行沒有背景色時，從第二行設置背景色。本任務完成后的效果如圖2-1所示。

圖2-1 斑馬線表格最終效果