JavaScript如何实现钟表效果，时分秒针指向当前时间，并显示当前年月日,及2024春节倒计时，源码奉上

 本篇有运用jQuery，记得引入jQuery库，否则不会执行的喔~

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="chenc" content="Runoob">
<meta name="description" content="时钟 时间 & 钟表 日历">
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/jquery-3.6.0.js"></script>
<script src="js/app.js"></script>

</head>
<body>
    <div class="today">
        <div class="clock">
            <div class="pos SS"></div>
            <div class="pos MM"></div>
            <div class="pos HH"></div>
            <div class="spot"></div>
        </div>
    </div>
</body>
</html>
*{margin: 0 auto;padding: 0;}
html,body{background: #eeeeed;font-size: 14px;color: white!important;}
/* html,body{
	background-color:#a018d3;
	background-repeat: repeat-y;
	background-image: -moz-linear-gradient(left,#a018d3,#fe30ae);
	background-image: -webkit-linear-gradient(left,#a018d3,#fe30ae);
	background-image: -o-linear-gradient(left,#a018d3,#fe30ae);
	background-image: linear-gradient(left,#a018d3,#fe30ae);
	position: relative;
	overflow-x: hidden;
} */
@font-face {
	font-family:impact;
	src:url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/fonts/a07974d9a45376b8441d90005764beb0.eot);
	src:url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/fonts/a07974d9a45376b8441d90005764beb0.eot#iefix) format("embedded-opentype"),
	url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/fonts/b07c9855bd807ccc9d825cb0392c6ef8.woff) format("woff"),
	url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/fonts/1a0d82dfb49fff2d2a291d3dbce6c95c.ttf) format("truetype"),
	url(https://misc.360buyimg.com/mtd/pc/index_2019/1.0.0/fonts/d1e37bdd079d3151cc0edcc71d2c8f0f.svg) format("svg");
	font-weight:400;
	font-style:normal
   }
@font-face {
    font-family:DINBold;
    src:url(../fonts/dinbold-webfont.bc8aa63.woff);
    font-weight:400;
    font-style:normal
}
@font-face {
    font-family:DINBold;
    src:url(../fonts/DIN-Bold_0.otf);
    font-weight:400;
    font-style:normal
}
@font-face {
	font-family:DINBold;
	src:url(https://jddx.jd.com/finance/index/3.0.0/static/fonts/dinbold-webfont.bc8aa63.woff);
	font-weight:400;
	font-style:normal
}
.today {
	width: 100%;
	height: auto;
    margin: 0 auto;
    text-align: center;
	padding: 20px;
	box-sizing: border-box;
}
.today p{
	margin: 20px auto;
}
.clock {
	position: relative;
	width: 300px;
	height: 300px;
	margin: 20px auto 0px;
	text-align: center;
	background: white;
	border-radius: 50%;
	border: 12px solid #590d75;
	box-shadow: inset 0px 0px 20px 2px rgba(89,13,117,.6);
}
.clock ol {
	list-style-type: none;
	width: 100%;
	height: 100%;
	position: relative;
	margin: 0;
	padding: 0;
	transform: scale(0.96);
}
.clock ol li::before {
	font-family: Helvetica;
	content: counter(labelCounter) "";
}
.clock ol li {
	counter-increment: labelCounter;
	position: absolute;
    font-size: 1.5em;
    color: #7d13a5;
}
.clock ol li:nth-child(1){right:73px;top:21px}
.clock ol li:nth-child(2){right:29px;top:64px}
.clock ol li:nth-child(3){right:12px;top:123px}
.clock ol li:nth-child(4){right:31px;bottom:64px}
.clock ol li:nth-child(5){right:73px;bottom:21px}
.clock ol li:nth-child(6){left:132px;bottom:5px}
.clock ol li:nth-child(7){left:73px;bottom:21px}
.clock ol li:nth-child(8){left:31px;bottom:65px}
.clock ol li:nth-child(9){left:12px;top:123px;}
.clock ol li:nth-child(10){left:27px;top:64px}
.clock ol li:nth-child(11){left:69px;top:22px}
.clock ol li:nth-child(12){left:126px; top:5px;}
.spot {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 30px;
	height: 30px;
	/* background: #DD2476; */
    border-radius: 50%;
    z-index: 5;
}
.HH {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 13px;
	height: 13px;
	border-radius: 7px;
	transform: rotate(0deg);
	z-index: 97;
	background: #4e0b66;
	opacity: 0.8;
}
.HH::before {
	width: 10px;
	height: 65px;
	border-radius: 5px;
	background: #4e0b66;
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%,0);
}
.MM {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 13px;
	height: 13px;
	border-radius: 7px;
	transform: rotate(0deg);
	z-index: 98;
	background: #7d13a5;
	opacity: 0.8;
}
.MM:before {
	width: 6px;
	height: 95px;
	border-radius: 4px;
	background: #7d13a5;
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%,0);
}
.SS {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 13px;
	height: 13px;
	border-radius: 7px;
	transform: rotate(0deg);
	z-index: 99;
	background: #fe30ae;
	opacity: 0.8;
}
.SS:before {
	width: 2px;
	height: 135px;
	border-radius: 4px;
	background: #fe30ae;
	position: absolute;
	bottom: -20px;
	left: 50%;
	transform: translate(-50%,0);
	box-shadow: 2px 0px 5px rgba(174, 28, 92,.5);
}
.HH::after, .HH::before,
.MM::after, .MM::before,
.SS::after, .SS::before {
	content: "";
	display: block;
	position: absolute;
}
.day {
	margin: 10px auto 20px;
	text-align: left;
	font-size: 24px;
	font-family: DINBold;
	font-weight: lighter;
	width: 145px;
}
.time span,
.day span {
	/* font-weight: bold; */
    margin: 0px 2px;
	font-family: DINBold;
	font-weight: lighter;
	font-size: 24px;
	vertical-align: middle;
}
.time p{
	vertical-align: middle;
}
.time p:nth-child(1){
	font-size: 20px;
}
.time p span{
	font-family: DINBold;
	font-weight: lighter;
	font-size: 36px;
}
.sydate,
.time{
	color: yellow;
	vertical-align: middle;
}
.sydate{
	margin: 10px auto;
}
.sydate span{
	font-family: DINBold;
	font-weight: lighter;
	margin: 0px 2px;
}
.date {
	position: absolute;
	top: 65px;
	left: 0;
	right: 0;
	color: #590d75;
	text-align: center;
	font-size: 15px;
}
.times {
	position: absolute;
	bottom: 65px;
	left: 0;
	right: 0;
	color: #590d75;
	text-align: left;
	font-size: 16px;
	width: 100px;
}
.times span,
.date span{
	margin: 0px 2px;	
	color: #b21beb;
	font-family: DINBold;
	font-weight: lighter;
}
.week {
	position: absolute;
	top: 125px;
	right: 40px;
	color: #7d13a5;
	text-align: center;
	/* border: 1px solid #7d13a5; */
	width: 52px;
	height: 22px;
	line-height: 21px;
	font-size: 12px;
	z-index: 0;
	box-shadow: inset 0px 0px 10px 1px rgba(89,13,117,.3);
}
.year {
	position: absolute;
	top: 80px;
	left: 0;
	right: 0;
	color: #590d75;
	text-align: center;
	font-size: 80px;
	font-family: impact;
	opacity: 0.08;
	z-index: 1;
}

@-webkit-keyframes rotateOutDownLeft {
	0% {
		transform-origin: left bottom;
		opacity: 1
	}

	0%,to {
		-webkit-transform-origin: left bottom
	}

	to {
		transform-origin: left bottom;
		-webkit-transform: rotate(45deg) translateY(20px);
		transform: rotate(45deg) translateY(20px);
		opacity: 0
	}
}

@keyframes rotateOutDownLeft {
	0% {
		transform-origin: left bottom;
		opacity: 1
	}

	0%,to {
		-webkit-transform-origin: left bottom
	}

	to {
		transform-origin: left bottom;
		-webkit-transform: rotate(45deg) translateY(20px);
		transform: rotate(45deg) translateY(20px);
		opacity: 0
	}
}

.Lose{
	display: -webkit-inline-box;
	animation: rotateOutDownLeft 1000ms infinite;
    -webkit-animation: rotateOutDownLeft 1000ms infinite; /* Safari 与 Chrome */
}
.Barrage {
	position: absolute;
	width: 100%;
	height: 380px;
	margin: 0 auto;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99;
}
.message {
	width: 60%;
	height: 50px;
	border-radius: 25px;
	text-align: center;
	line-height: 48px;
	font-size: 15px;
	cursor: pointer;
	background: rgba(89,13,117,.25);
	/* background-color: #a018d3;
	background-repeat: repeat-y;
	background-image: -moz-linear-gradient(0deg,rgba(254,48,174,.5),rgba(160,24,211,.5));
	background-image: -webkit-linear-gradient(0deg,rgba(254,48,174,.5),rgba(160,24,211,.5));
	background-image: -o-linear-gradient(0deg,rgba(254,48,174,.5),rgba(160,24,211,.5));
	background-image: linear-gradient(0deg,rgba(254,48,174,.5),rgba(160,24,211,.5)); */
}

.key {
	position: fixed;
	width: 100%;
	height: 200px;
	padding: 40px 20px 20px 20px;
	box-sizing: border-box;
	background: white;
	z-index: 20;
	bottom: -400px;
	border-radius: 20px 20px 0px 0px;
	transition: all 300ms;
}
.keys{
	bottom: 0px;
	animation: keys 300ms ease;
    -webkit-animation: keys 300ms ease; /* Safari 与 Chrome */
}
@-webkit-keyframes keys {
	0% {
		transform: translateY(400px);
	}
	100% {
		transform: translateY(0px);
	}
}
@keyframes keys {
	0% {
		transform: translateY(400px);
	}
	100% {
		transform: translateY(0px);
	}
}

.van-field__control {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
	color: #323233;
	text-align: left;
	background-color: transparent;
	border: 0;
	resize: none;
	min-height: 100px;
	font-size: 16px;
}
.buts {
	width: 80%;
	height: 42px;
	background-color: #a018d3;
	background-repeat: repeat-y;
	background-image: -moz-linear-gradient(left,#a018d3,#fe30ae);
	background-image: -webkit-linear-gradient(left,#a018d3,#fe30ae);
	background-image: -o-linear-gradient(left,#a018d3,#fe30ae);
	background-image: linear-gradient(left,#a018d3,#fe30ae);
	border-radius: 21px;
	line-height: 42px;
	text-align: center;
	font-size: 16px;
	cursor: pointer;
}
.iocnBox {
	position: absolute;
	width: 100%;
	height: 40px;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	color: #333;
	text-align: right;
	padding-right: 20px;
	line-height: 40px;
	cursor: pointer;
}
.iocnBox i {
	font-size: 18px;
	color: #909399;
}
.remove{
	animation-fill-mode: forwards;
	animation: remove 300ms ease;
    -webkit-animation: remove 300ms ease; /* Safari 与 Chrome */
}
@-webkit-keyframes remove {
	0% {
		transform: translateY(0px);
	}
	100% {
		transform: translateY(400px);
	}
}
@keyframes remove {
	0% {
		transform: translateY(0px);
	}
	100% {
		transform: translateY(400px);
	}
}

.Barrage span {
	position: absolute;
	background: rgba(89,13,117,.25);
	color: white;
	display: initial;
	padding: 0px 15px;
	box-sizing: border-box;
	border-radius: 20px;
	line-height: 35px;
	animation: Barrag 10s linear infinite;
	-webkit-animation: Barrag 10s linear infinite;
	top: 60px;
	white-space: nowrap;
	font-size: 12px;
}
@keyframes Barrag
{
    0% {right: -200px;opacity: 1;}
    80% {right: 1120px;opacity: 1;}
    100% {right: 1400px;opacity: 0;}
}
 
@-webkit-keyframes Barrag /* Safari 与 Chrome */
{
    0% {right: -200px;opacity: 1;}
    80% {right: 1120px;opacity: 1;}
    100% {right: 1400px;opacity: 0;}
}
.Barrage span:nth-child(2):before,
.Barrage span:nth-child(1):before{
	content:"";
	width: 24px;
	height: 24px;
	margin-right: 5px;
	background:url(../images/bq001.png) no-repeat;
	background-size: 24px 24px;
	background-position: center bottom;
	display: inline-block;
	vertical-align: middle;
}
.Barrage span:nth-child(2):after,
.Barrage span:nth-child(1):after{
	content:"";
	width: 26px;
	height: 26px;
	margin-left: 5px;
	background:url(../images/bq002.gif) no-repeat;
	background-size: 26px auto;
	background-position: center bottom;
	display: inline-block;
	vertical-align: middle;
}
.B-span2{
	top: 100px!important;
	color: #ff0!important;
	animation: Barrag 6s linear infinite!important;
	-webkit-animation: Barrag 6s linear infinite!important;
}
.Barrage span:nth-child(3){
	top: 140px!important;
	color: #0dd2ef!important;
	animation: Barrag 12.8s linear infinite!important;
	-webkit-animation: Barrag 12.8s linear infinite!important;
}
.Barrage span:nth-child(4){
	top: 160px!important;
	color: #ff0!important;
	animation: Barrag 10s linear infinite!important;
	-webkit-animation: Barrag 10s linear infinite!important;
}
.Barrage span:nth-child(5){
	top: 190px!important;
	color: #3fd316!important;
	animation: Barrag 17.5s linear infinite!important;
	-webkit-animation: Barrag 17.5s linear infinite!important;
}
.Barrage span:nth-child(6){
	top: 100px!important;
	color: #ff0!important;
	animation: Barrag 20s linear infinite!important;
	-webkit-animation: Barrag 20s linear infinite!important;
}
.Barrage span:nth-child(7){
	top: 120px!important;
	color: #0dd2ef!important;
	animation: Barrag 15s linear infinite!important;
	-webkit-animation: Barrag 15s linear infinite!important;
}
.Barrage span:nth-child(8){
	top: 200px!important;
	color: #ff0!important;
	animation: Barrag 16s linear infinite!important;
	-webkit-animation: Barrag 16s linear infinite!important;
}
.Barrage span:nth-child(9){
	top: 80px!important;
	color: #3fd316!important;
	animation: Barrag 8s linear infinite!important;
	-webkit-animation: Barrag 8s linear infinite!important;
}
@keyframes Barragss
{
    0% {right: 0px;opacity: 1;}
    80% {right: 1120px;opacity: 1;}
    100% {right: 1400px;opacity: 0;}
}
 
@-webkit-keyframes Barragss /* Safari 与 Chrome */
{
    0% {right: 0px;opacity: 1;}
    80% {right: 1120px;opacity: 1;}
    100% {right: 1400px;opacity: 0;}
}

.Tips {
	background: rgba(0,0,0,.6);
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 120px;
	height: 45px;
	border-radius: 4px;
	line-height: 45px;
	text-align: center;
}

.empty {
	position: absolute;
	width: 40px;
	height: 30px;
	top: 38px;
	right: 15px;
	margin: auto;
	color: red;
	text-align: center;
	line-height: 30px;
	cursor: pointer;
	opacity: 0;
}
.Tipss{
	background: rgba(0,0,0,.6);
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 200px;
	height: 45px;
	border-radius: 4px;
	line-height: 45px;
	text-align: center;
}
.music {
	width: 270px;
	margin: 30px auto;
	height: 45px;
}
.music audio {
	background: none;
	width: 100%;
	height: 100%;
}
.music marquee {
	font-size: 13px;
	color: yellow;
	margin-top: 5px;
}

$(document).ready(function(){   
    //加入时钟数字元素 
    var list = "<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>";
    var ool = "<ol>" + list + "</ol>";
    $(".spot").after(ool);
    //显示日期
    var date = "<div class='date'></div>";
    $(".spot").before(date);
    //显示星期
    var week = "<div class='week'></div>";
    $(".date").before(week);
    //显示年度
    var year = "<div class='year'></div>";
    $(".date").before(year);
    //显示时间
    var times = "<div class='times'></div>";
    $(".date").before(times);

    // 春节倒计时
    var starttime = new Date("2024/1/10");
    setInterval(function () {
        var nowtime = new Date();
        var time = starttime - nowtime;
        var day = parseInt(time / 1000 / 60 / 60 / 24);
        var hour = parseInt(time / 1000 / 60 / 60 % 24);
        var minute = parseInt(time / 1000 / 60 % 60);
        var seconds = parseInt(time / 1000 % 60);
        
        var syday = "<span>" + hour + "</span>" + "小时" + "<span>" + minute + "</span>" + "分钟" + "<span class='Lose'>" + seconds + "</span>" + "秒";
        $('.time').html("<p>春节倒计时</p>" + "<p><span>" + day + "</span>" + "天</p>");
        $(".sydate").html(syday);
        
    }, 1000);
    
    // 时钟走字方法
    function Todayss(){
        var day = new Date();  //日期
        var Y = day.getFullYear();  //年
        var M = day.getMonth() + 1;  //月
        var D = day.getDate();  //日
        var U = day.getUTCDay();  //周
        var H = day.getHours();  //时
        var MIN = day.getMinutes();  //分
        var S = day.getSeconds();  //秒
        var MSs = day.getMilliseconds();
        var MS = MSs.toString().substring(0,2);
        // 计算指针度数
        var sss = S * 6,
            mmm = MIN * 6 + (sss * 0.01),
            hhh = (H * 30) + (MIN * 0.5);
        var rotss = "rotate(" + sss + "deg)"; 
        var rotmm = "rotate(" + mmm + "deg)";
        var rothh = "rotate(" + hhh + "deg)";
        $(".HH").css({"transform":rothh});
        $(".MM").css({"transform":rotmm});
        $(".SS").css({"transform":rotss});            
        // 小于两位数,保持两位
        if(M < 10){M = "0" + M;};
        if(D < 10){D = "0" + D;};
        if(H < 10){H = "0" + H;};
        if(MIN < 10){MIN = "0" + MIN;};
        if(S < 10){S = "0" + S;};  

        switch (U){
            case 0:U="星期日";
          break;
            case 1:U="星期一";
          break;
            case 2:U="星期二";
          break;
            case 3:U="星期三";
          break;
            case 4:U="星期四";
          break;
            case 5:U="星期五";
          break;
            case 6:U="星期六";
          break;
       };

      //星期赋值
      var week = U;
      $(".week").html(week);

      //年份赋值
      var year = Y;
      $(".year").html(year);

      //日期赋值
      var date = "<span>" + M + "</span>" + "月" + "<span>" + D + "</span>" + "日";
      $(".date").html(date);

      //时间赋值
      var times = "<span>" + H + "</span>" + ":" + "" + "<span>" + MIN + "</span>" + ":" + "" + "<span>" + S + "</span>" + ":" + "" + "<span>" + MS + "</span>";
      $(".times").html(times);

    }
    // Todayss();
    setInterval(Todayss, 10);

});

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/128819.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

人工智能中的基础之一——Python

人工智能中的基础之一——Python

Python作为一种简洁、易学、功能丰富的高级编程语言&#xff0c;被广泛应用于数据分析、人工智能、Web开发等各个领域。本文将介绍Python的基础语法和使用&#xff0c;帮助读者快速上手Python编程。 一、Python基础语法 1. 变量和数据类型 在Python中&#xff0c;可以使用变…
阅读更多...
C#，Python实践，用CodeFormer实现人脸重建（Face Restoration），模糊清晰、划痕修复及黑白上色

C#，Python实践，用CodeFormer实现人脸重建（Face Restoration），模糊清晰、划痕修复及黑白上色

无论是自己、家人或是朋友、客户的照片&#xff0c;免不了有些是黑白的、被污损的、模糊的&#xff0c;总想着修复一下。作为一个程序员 或者 程序员的家属&#xff0c;当然都有责任满足他们的需求、实现他们的想法。除了这个&#xff0c;学习了本文的成果&#xff0c;或许你还…
阅读更多...
【Unity程序小技巧】如何消除多次Destory带来的性能消耗

【Unity程序小技巧】如何消除多次Destory带来的性能消耗

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;元宇宙-秩沅 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 秩沅 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a;Uni…
阅读更多...
Linux学习第36天：Linux RTC 驱动实验：时间是一条流淌的河

Linux学习第36天：Linux RTC 驱动实验：时间是一条流淌的河

Linux版本号4.1.15 芯片I.MX6ULL 大叔学Linux 品人间百味 思文短情长 RTC就是实时时钟。 本笔记主要学习Linux RTC驱动试验&#xff0c;主要内容包括Linux内核RTC驱动简介、I.MX6U内部RTC分析、RTC时间查看与设置。因为Linux内核已经…
阅读更多...
Docker - 常用命令

Docker - 常用命令

Docker - 常用命令 帮助命令 docker version # 查看docker版本信息 docker info # 显示docker的系统信息&#xff0c;包括镜像和容器的数量 docker 命令 --help # 帮助命令官网帮助文档&#xff1a;https://docs.docker.com/engine/reference/commandline/cli/ 镜像…
阅读更多...
接口测试及常用接口测试工具

接口测试及常用接口测试工具

首先&#xff0c;什么是接口呢&#xff1f; 接口一般来说有两种&#xff0c;一种是程序内部的接口&#xff0c;一种是系统对外的接口。 系统对外的接口&#xff1a;比如你要从别的网站或服务器上获取资源或信息&#xff0c;别人肯定不会把数据库共享给你&#xff0c;他只能给你…
阅读更多...
【算法与数据结构】77、LeetCode组合

【算法与数据结构】77、LeetCode组合

文章目录 一、题目二、解法三、完整代码 所有的LeetCode题解索引&#xff0c;可以看这篇文章——【算法和数据结构】LeetCode题解。 一、题目 二、解法 思路分析&#xff1a;如果k是固定的&#xff0c;最直接的方法就是建立k个for循环&#xff0c;将结果全部压入result容器中。…
阅读更多...
联合阿里在职测开工程师耗时一个星期写的 【接口测试+自动化接口接口测试详解]

联合阿里在职测开工程师耗时一个星期写的 【接口测试+自动化接口接口测试详解]

1&#xff1a;json模块的使用　 2&#xff1a;接口自动化测试概叙 3&#xff1a;swagger工具能导出接口文档的 4:前端页面: 5:后端: 6:前端和后端的数据交互&#xff08;接口&#xff09;通过接口 7&#xff1a;接口的概念 8&#xff1a;常用的接口方式&#xff08;协议…
阅读更多...
自动化测试中的失败截图和存log

自动化测试中的失败截图和存log

如果我们在执行自动化测试的时候&#xff0c;希望能在失败的时候保存现场&#xff0c;方便事后分析。 对于UI自动化&#xff0c;我们希望截图在测试报告中。 对于api自动化&#xff0c;我们希望截取出错的log在测试报告中。 我开始自己蛮干&#xff0c;写了两个出错截图的方法。…
阅读更多...
Essential Math for AI：高效的人工智能数学原理晋级读物

Essential Math for AI：高效的人工智能数学原理晋级读物

今天给大家介绍一本人工智能数学原理书籍&#xff1a;Essential Math for AI。作者是Hala Nelson&#xff0c;一位应用数学领域的美女博士&#xff0c;James Madison University (JMU) 大学的助理教授。 关注微信公众号&#xff1a;人工智能大讲堂&#xff0c;后台回复【ema】获…
阅读更多...
【Android】Debug时禁用主线程ANR限制

【Android】Debug时禁用主线程ANR限制

ANR全称Application Not Response&#xff0c;指主线程超过5s无响应&#xff0c;应用会自动退出 由于这个线程&#xff0c;如果我们给主线程加了断点&#xff0c;就会触发ANR&#xff0c;导致调试时应用退出 这样调试起来会非常麻烦&#xff0c;其实对于Debug应用&#xff0c…
阅读更多...
JVM虚拟机-虚拟机性能监控、故障处理工具

JVM虚拟机-虚拟机性能监控、故障处理工具

1基础故障处理工具 jps&#xff08;JVM Process Status Tool&#xff09;是&#xff1a;虚拟机进程状况工具 作用&#xff1a;可以列出正在运行的虚拟机进程&#xff0c;并显示虚拟机执行主类&#xff08;Main Class&#xff0c;main()函数所在的类&#xff09;名称以及这些进…
阅读更多...
人工智能基础——python：Pandas与数据处理

人工智能基础——python：Pandas与数据处理

人工智能的学习之路非常漫长&#xff0c;不少人因为学习路线不对或者学习内容不够专业而举步难行。不过别担心&#xff0c;我为大家整理了一份600多G的学习资源&#xff0c;基本上涵盖了人工智能学习的所有内容。点击下方链接,0元进群领取学习资源,让你的学习之路更加顺畅!记得…
阅读更多...
CSS基础：你必须要知道的行高属性 line-height

CSS基础：你必须要知道的行高属性 line-height

作者:WangMin 格言:努力做好自己喜欢的每一件事 CSDN原创文章 博客地址 &#x1f449; WangMin 对于初学CSS的同学来说&#xff0c;会有很多属性相关的疑问&#xff0c;行高属性 line-height一定是其中一个&#xff0c;因为它是CSS中非常重要的一个属性&#xff0c;这个属性改变…
阅读更多...
AlphaControls控件TsRadioGroup的使用

AlphaControls控件TsRadioGroup的使用

通常使用AlphaControls控件中的TsRadioGroup时&#xff0c;往往使用默认值&#xff0c;会造成TsRadioGroup标题被TsRadioGroup的ITEMs占用&#xff0c;严重影响美观&#xff1a; 解决方案&#xff0c;通过对TsRadioGroup的ContentVOffset属性&#xff0c;设置为10。即可立即改善…
阅读更多...
【ARFoundation学习笔记】点云与参考点

【ARFoundation学习笔记】点云与参考点

写在前面的话 本系列笔记旨在记录作者在学习Unity中的AR开发过程中需要记录的问题和知识点。主要目的是为了加深记忆。其中难免出现纰漏&#xff0c;更多详细内容请阅读原文以及官方文档。 汪老师博客 文章目录 点云新建点云 参考点参考点的工作原理何时使用参考点使用参考点…
阅读更多...
【高等数学】导数的应用

【高等数学】导数的应用

导数的应用 1、洛必达法则1.1、引例1.2、内容1.3、证明1.4、洛必达的应用总结 1.5、注意 2、泰勒公式2.1、解决的问题2.2、引例2.3、内容2.3.1、带Peano余项的泰勒公式2.3.2、带Lagrange余项的泰勒公式2.3.3、麦克劳林公式2.3.4、几个初等函数的麦克劳林公式 2.4、证明2.5、泰勒…
阅读更多...
SpringBoot 监控

SpringBoot 监控

概述 SpringBoot自带监控功能Actuator&#xff0c;可以帮助实现对程序内部运行情况监控&#xff0c;比如监控状况、Bean加载情况、配置属性、日志信息等。 使用步骤 导入依赖坐标 <dependency><groupId>org.springframework.boot</groupId><artifactI…
阅读更多...
Vuex模块概念

Vuex模块概念

一、核心概念 - module 1.目标 掌握核心概念 module 模块的创建 2.问题 由于使用单一状态树&#xff0c;应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时&#xff0c;store 对象就有可能变得相当臃肿。 这句话的意思是&#xff0c;如果把所有的状态都放在s…
阅读更多...
智慧城市建设解决方案分享【完整】

智慧城市建设解决方案分享【完整】

文章目录 第1章 前言第2章 智慧城市建设的背景2.1 智慧城市的发展现状2.2 智慧城市的发展趋势 第3章 智慧城市“十二五”规划要点3.1 国民经济和社会发展“十二五”规划要点3.2 “十二五”信息化发展规划要点 第4章 大数据&#xff1a;智慧城市的智慧引擎4.1 大数据技术—智慧城…
阅读更多...
最新文章

Copyright @ 2022~2023