从头记录——JS与HTML页面的制作过程

工作经验总结

感叹：我太难了！
本篇为个人工作记录，具体代码涉及本人公司业务不予贴出，但会有小demo与效果图作为参考。

任务

使用技术：
js、jquery、ajax、
前端页面需求：
1、表格。
2、点击按钮弹出弹窗。
3、input表单，一边数字改变，另一边数字响应变化。
4、按百分比显示进度条长度与数值。
5、点击筛选按钮，滑出筛选框。
6、点击input框，弹出日期选择框。

过程

一、 首先做出一个表格。

先用HTML/CSS做静态样式，使用ajax动态传值，使用js追加数据及表格样式。
使用CSS中odd和even对表格奇偶行样式设置。

代码

1. 表头是静态的，直接写静态HTML即可。

   <!--START表头-->
   <div class="..." style="padding-top: 0px;margin-top:0px;">
    <div class="...">
        <div style="margin-left: 15px;width: 12.5%;text-align: center;">店鋪情報</div>
        <div style="width: 20.2%;text-align: center;">商品情報</div>
   	...
   	...
    </div>
    <div class="...">
        <div style="margin-left: 15px;width: 7%;text-align: center;">店鋪コード</div>
        <div style="width: 6%;text-align: center;">店鋪名</div>