Javascript基础笔记(部分)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            body {                                                            /* 一些标签的自定义 */
                background: url(../img/backgroud.jpg);
                background-attachment: fixed;
            }
            div.right_top {
                position: absolute;
                top: 0px;
                left:1050px;
            }
            a.cai {
                text-decoration: none;
            }
            a.cai:link, a.cai:visited {
                display: block;                    
                width: 120px;
                font-weight: 500;
                text-align:center;
                color: #FFFFFF;
                height: 25px;
                background-color:#98bf21;
                padding: 1px;
            }
            a.cai:active, a.cai:hover {
                background:#7A991A;
            }
        </style>
        
        <script>                                                                   //js 脚本
            function answer() {                                                    //建立一个函数
                var x = document.getElementById("problem").innerHTML;              //设变量并赋值
                if(x == "2018年") {
                    document.getElementById("problem").innerHTML = "今年是哪一年?";
                }
                else {
                    document.getElementById("problem").innerHTML = "2018年";       //给 id 赋值
                }
            }
            function lucky() {
                var x = Math.random()*10000;
                x = parseInt(x);
                document.getElementById("lucky").innerHTML = x;
            }
            function alert1() {                                                    //弹出警告框
                alert("请不要随便乱点按钮!!!");
            }
            function alert2(x) {
                alert("Hello " + x);
            }
            function startTime(){                                                 //得到系统时间
                var today=new Date();
                var h=today.getHours();
                var m=today.getMinutes();
                var s=today.getSeconds();
                document.getElementById('time').innerHTML=h+":"+m+":"+s;          //将时间打印到界面上
                t=setTimeout(function(){startTime()},500);                        //自动刷新
            }
        
        </script>
    </head>
    <body onload="startTime()">
        <a class="cai" href="http://www.runoob.com" target="_blank">菜鸟教程</a>
        <a class="cai" href="http://www.runoob.com/js/js-examples.html" target="_blank">JavaScript</a>
        <div class="right_top">                                            <!-- _blank:打开新标签页 -->        
            <h2 id="problem">今年是哪一年?</h2>
            <button onclick="answer()">转换</button> 
        </div>
        <script>document.write("<br>Hello world!")</script>
        <script>
            var name="Asimple";
            document.write("<br>" + name + "<br>");
        </script>
        <h3 id="lucky">查看你今天的幸运数字</h3>
        <button onclick="lucky()">查看</button> 
        <button onclick="alert1()">点击试试</button>
        <button onclick="alert2('Tom')">点击试试</button><br>
        <h2 id="time" style="position: absolute; top:100px; left: 1050px;"></h2>
    </body>
</html>

猜你喜欢

转载自www.cnblogs.com/Lunix-touch/p/9785912.html