在HTML页面或Div中显示时钟 [英] Display Clock inside the HTML page or Div

查看:86
本文介绍了在HTML页面或Div中显示时钟的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在研究一个项目,我试图在容器内显示一个时钟,以便时钟响应。我希望有人可以指导我如何去做。

I am Working on a project in which I am trying to display a clock inside container so that the clock becomes responsive. I was hoping if someone can guide me on how to go about it.

以下是我试图显示相同内容的HTML页面。

Below is the HTML page where I am trying to display the same.

<!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="utf-8">
        <title> UA </title>
        <meta name="description" content="EVERYTHING FINE">
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">

        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">

        <style>
        .grey{
                background-color: #ccc;
                padding: 20px;

        }
        </style>

    </head>

    <body>

        <header>
            <div class="jumbotron">
                <div class="container">
                    <script>
                   ............
                  </script>
                </div> 
            </div> 
        </header>

            <div class="grey">
                <div class="container">
                    <div class="well">R&D</div>
                </div>
            </div>



        <footer>
            <div class="container">
                <hr>

                <p>
                    <small><a href="http://hazratferozmemon.org/#/">Jump To TrueTasawwuf</a> TRUE TASAWWUF</small></p>
                <!--<p> <small><a href="http://twitter.com/wiredwiki">Ask whatever </a> On Twitter</small></p>-->
                <!--<p> <small><a href="http://youtube.com/wiredwiki">Subscribe me</a> On Youtube</small>-->

                </p>
            </div> <!-- end container -->
        </footer>

        <!-- Latest compiled and minified JavaScript -->
        <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    </body> 
    </html>


推荐答案

您可以使用导入的jquery构建时钟< br>
确保在jquery脚本标签之后放置脚本

You could build a clock using the jquery you imported
make sure you put the script after your jquery script tags

<script type="text/javascript">
$(document).ready(function(){
    var timer = setInterval(clock, 1)
    function clock(){
        $(".demo").html(Date());

    }

});
</script>
<body>
<p class="demo"></p>
</body>

这篇关于在HTML页面或Div中显示时钟的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆