关于javascript:在线时间戳转换工具纯JS-实现

先看成果吧，自己也始终在用，本人写的！须要用到的小伙伴能够珍藏

html

  <form class="form-horizontal">
            <div class="form-group">
                <label class="col-sm-2 control-label"> 以后工夫戳：</label>
                <div class="col-sm-2">
                    <p style="display: block;width: 100%;height: 34px;padding: 6px 12px;font-size: 14px;line-height: 1.42857143;color: #555;background-color: #fff;">
                        {{time}}
                    </p>
                </div>
                <div class="col-sm-7">
                    <a v-bind:class="class_tag" @click="status_timestamp" role="button">
                        {{text}}
                    </a>
                    <a class="btn btn-success" href="javascript:history.go(0);"> 刷新页面 </a>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label"> 格式化工夫戳：</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" v-model="value_one">
                </div>

                <div class="col-sm-1">
                    <a class="btn btn-info" @click="formate"> 转换 </a>
                </div>
                <div class="col-sm-3">
                    <input type="text" class="form-control" v-model="value_one_fmt">
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-2 control-label"> 工夫转换成工夫戳：</label>
                <div class="col-sm-3">
                    <input type="text" class="form-control" v-model="value_two">
                </div>
                <div class="col-sm-1">
                    <a class="btn btn-info" @click="formate_string_data"> 转换 </a>
                </div>
                <div class="col-sm-3">
                    <input type="text" class="form-control" v-model="value_two_fmt">
                </div>
            </div>
        </form>

JS 局部

<script src=”https://cdn.staticfile.org/axios/0.18.0/axios.min.js”></script>

    <script>

        function get_timestamp() {var timestamp = Date.parse(new Date()).toString();
            timestamp = timestamp.substr(0, 10);
            return timestamp;
        }

        var t = false, old_time = get_timestamp();

        var vm = new Vue({
            el: "#form",
            data: {
                time: old_time,
                class_tag: "btn-danger btn",
                text: "暂停",
                value_one: old_time,
                value_one_fmt: "",
                value_two: fmt_date_time(old_time, 's'),
                value_two_fmt: "",
                array: null
            }, methods: {status_timestamp: function () {if (t != false) {clearTimeout(t);
                        t = false;
                        this.$data.class_tag = "btn-success btn";
                        this.$data.text = "开始";
                    } else {set_timestamp();
                        this.$data.text = "暂停";
                        this.$data.class_tag = "btn-danger btn";
                    }
                },
                formate: function () {this.$data.value_one_fmt = fmt_date_time(this.$data.value_one, 's');
                },
                formate_string_data: function () {var date = new Date(this.$data.value_two.replace(/-/g, '/'));
                    var time = date.getTime();
                    var timestamp = time / 1000;
                    this.$data.value_two_fmt = timestamp;
                },
                close_ad: function () {layer.confirm('确定要敞开吗?<br/> 敞开后将一天不可见！', {icon: 7, title: '提醒'}, function (index) {Cookies.set('close_ad', 'close', {expires: 1, path: ''});
                        $("#close_ad").parent().parent().hide();
                        layer.close(index);
                    });
                }
            }, created: function () {
                var _that = this;
                axios
                    .post('/index/advertisement/getad.html')
                    .then(function (response) {//console.log(response)
                        if (response.data.state == 200) {
                            _that.array = response.data.data;
                            // console.log(_that.array)
                        }
                    })
                    .catch(function (error) { // 申请失败解决
                        console.log(error);
                    });
            }
        });


        set_timestamp();

        // 扭转工夫戳的值
        function set_timestamp() {var timestamp = get_timestamp();
            vm.$data.time = timestamp;
            t = setTimeout(set_timestamp, 1000);
        }

        // 工夫戳转换成
        function fmt_date_time(time, select_type) {var date = new Date();
            date.setTime(time * 1000);
            var y = date.getFullYear();
            var m = date.getMonth() + 1;
            m = m < 10 ? ('0' + m) : m;

            var d = date.getDate();
            d = d < 10 ? ('0' + d) : d;

            var h = date.getHours();
            h = h < 10 ? ('0' + h) : h;

            var minute = date.getMinutes();
            var second = date.getSeconds();
            minute = minute < 10 ? ('0' + minute) : minute;
            second = second < 10 ? ('0' + second) : second;

            var fmtString = '';

            switch (select_type) {
                case 'day':
                    fmtString = y + '-' + m + '-' + d;
                    break;
                case 'h':
                    fmtString = y + '-' + m + '-' + d + ' ' + h;
                    break;
                case 'm':
                    fmtString = y + '-' + m + '-' + d + '' + h +':' + minute;
                    break;
                case 's':
                    fmtString = y + '-' + m + '-' + d + '' + h +':'+ minute +':' + second;
                    break;
                default:
                    break;
            }
            return fmtString;
        }
    </script>
    细节上本人优化，当然也能够看看我的在线体验地址，F12 查看源代码，前端页面我本人基于 bootstarp 写的，搭建也能够本人优化。

在线地址