CSS+JS,在div中显示当前时间和星期

html-css024

CSS+JS,在div中显示当前时间和星期,第1张

<!DOCTYPE html>

<html>

<head>

<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">

</script>

<script>

$(document).ready(function(){

  $("p").click(function(){

     var str = "今天是"+(new Date()).toLocaleString()+" 星期" + "日一二三四五六".charAt(new Date().getDay())

     $(".time").html(str)

  })

})

</script>

</head>

<body>

<p>点击我</p>

<div class="time"></div>

</body>

</html>

实现效果这样?:

今天是2018/6/12 下午1:33:05 星期二

先设置时间的元素为视频的同级元素,然后相对于视频元素的父元素绝对定位。

视频父元素{position: relative}

时间元素{position:absoluteleft: 10pxtop:10px}

left和top值自己调整。

代表时间的代码不是在css中,css是一种样式,比如你在做网站的时候,前端html布局了一个页面,感觉不太美观的时候用css样式来控制一下,使其页面更加的美化与易懂;

而代表时间的代码是html中的time(英语也是"时间"的意思)<time>时间是:******</time>

time中属性:datetime 值:datetime

time描述:定义元素的日期和时间。如果未定义该属性,则必须在元素的内容中规定日期或时间。