在hta应用程序中使用HTML和Javascript显示当前日期和时间，并具有可滚动的效果

Display the current date and time using HTML and Javascript with scrollable effects in hta application

本文关键字：滚动 时间 当前日期 应用程序 hta 显示 Javascript HTML      更新时间：2023-09-26

我有下面的java脚本显示当前日期在给定的格式星期一6月2日17:54:28 UTC+0530 2014在hta(html应用程序)，现在我想让它出现在欢迎我的系统的当前日期的方式:星期一6月2日17:54:28 UTC+0530 2014这个文本应该是一个具有可滚动的影响例如:一个从右到左移动。

我试图使用下面的标签来获得一个可滚动的文本，但是我如何才能在<marquee>标签中调用这个java脚本变量，以便我获得今天的日期和时间也作为可滚动影响的一部分，但它不适用于我的HTML页面。

请告诉我如何纠正这个问题

HTML代码: 

<marquee behavior="scroll" bgcolor="yellow" loop="-1" width="30%">
  <i><font color="blue"><strong>Welcome</strong> Today's date is : </font></i>
</marquee>

JAVASCRIPT显示当前日期和时间:

 <script language="javascript">
 var today = new Date();
 document.write(today);
 </script>

方法一:

带marquee标签

<marquee behavior="scroll" bgcolor="yellow" loop="-1" width="30%">
   <i>
      <font color="blue">
        Today's date is : 
        <strong>
         <span id="time"></span>
        </strong>           
      </font>
   </i>
</marquee>

JS 

var today = new Date();
document.getElementById('time').innerHTML=today;

方法2:

不带marquee标签，带CSS标签。

<p class="marquee">
    <span id="dtText"></span>
</p>
CSS

.marquee {
   width: 350px;
   margin: 0 auto;
   background:yellow;
   white-space: nowrap;
   overflow: hidden;
   box-sizing: border-box;
   color:blue;
   font-size:18px;
}
.marquee span {
   display: inline-block;
   padding-left: 100%;
   text-indent: 0;
   animation: marquee 15s linear infinite;
}
.marquee span:hover {
    animation-play-state: paused
}
@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}

JS 

var today = new Date();
document.getElementById('dtText').innerHTML=today;

在这里播放demo

这对你有帮助。

Javascript 

debugger;
var today = new Date();
document.getElementById('date').innerHTML = today
<

小提琴演示/h2> 

<script>
    var today = new Date;
    document.getElementById('date').innerHTML= today.toDateString();
</script>

试试这个:

HTML:

<div id="para1"></div>
JavaScript:

document.getElementById("para1").innerHTML = formatAMPM();
function formatAMPM() {
var d = new Date(),
    minutes = d.getMinutes().toString().length == 1 ? '0'+d.getMinutes() : d.getMinutes(),
    hours = d.getHours().toString().length == 1 ? '0'+d.getHours() : d.getHours(),
    ampm = d.getHours() >= 12 ? 'pm' : 'am',
    months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
    days = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];
return days[d.getDay()]+' '+months[d.getMonth()]+' '+d.getDate()+' '+d.getFullYear()+' '+hours+':'+minutes+ampm;
}
结果:

Mon Sep 18 2017 12:40pm

<div id="clockbox" style="font:14pt Arial; color:#FF0000;text-align: center; border:1px solid red;background:cyan; height:50px;padding-top:12px;"></div>
相关文章：