前端的一些东西总结

1.hr分割线的用法
height:2px; 是hr的高度
border:none;是没有边框
border-top:2px dotted #DFDFDF;是设置上横线的样式
border-bottom:2px dotted #DFDFDF;是设置下横线的样式
dotted 虚线 #DFDFDF颜色

 
 
"border:1 dashed #5151A2" />
"border:none;border-top:2px dashed #DFDFDF;" />
"border-top: 2px dashed #DFDFDF; border-bottom: 2px dashed #DFDFDF; height: 2px" color=black />
"height:10px;border:none;border-top:10px groove skyblue;" />

在这里插入图片描述

2.一个经典布局,和拓展用法
div内的三个div横向排布,中间固定宽度,剩下两个平分剩下的宽度

前端的一些东西总结_第1张图片
3.常见的DOM操作和事件
前端的一些东西总结_第2张图片
前端的一些东西总结_第3张图片
前端的一些东西总结_第4张图片
前端的一些东西总结_第5张图片

4.关于时间的两个工具方法
时间戳转年-月-日

dataToDate: function(data) {
		//data为时间戳
		var date = new Date(data);
		var Y = date.getFullYear() + '-';
		var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
		var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
		var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
		var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
		var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
		var strDate = Y + M + D + h + m + s; //转换为年月日时分秒
		var strDate = Y + M + D; //转换为年月日
		return strDate;
		}

前端的一些东西总结_第6张图片
前端的一些东西总结_第7张图片

显示实时时间

function showTime() { //时间显示函数
    var now = new Date(); //创建一个Date对象
    var year = now.getFullYear(); //年
    var month = now.getMonth() + 1; //月份(从0开始),所以+1
    var date = now.getDate(); //日(1-31)
    var day = now.getDay();  //星期(0-6)
    var h = now.getHours(); //小时(0-23)
    var m = now.getMinutes();  //分钟(0-59)
    var s = now.getSeconds();  //秒
    m = checkTime(m)
    s = checkTime(s)
    var weekday = new Array(7)  //星期数进一处理
    weekday[0] = "星期日";
    weekday[1] = "星期一";
    weekday[2] = "星期二";
    weekday[3] = "星期三";
    weekday[4] = "星期四";
    weekday[5] = "星期五";
    weekday[6] = "星期六";
    document.getElementById("showtime").innerHTML = weekday[day] + " " + year + "年" + month + "月" + date + "日 " + h + ":" + m + ":" + s;
    t = setTimeout('showTime()', 1000)  //设置定时器,每隔1s调用一次函数从而实现动态效果
}

在这里插入图片描述

你可能感兴趣的:(前端和LayUI)