数字Math和DOM树操作

1，用于执行常用的数学任务，它包含了若干个数字常量和函数

abs(x)	返回数的绝对值。
acos(x)	返回数的反余弦值。
asin(x)	返回数的反正弦值。
atan(x)	以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
atan2(y,x)	返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。
ceil(x)	对数进行上舍入。
cos(x)	返回数的余弦。
exp(x)	返回 e 的指数。
floor(x)	对数进行下舍入。
log(x)	返回数的自然对数（底为e）。
max(x,y)	返回 x 和 y 中的最高值。
min(x,y)	返回 x 和 y 中的最低值。
pow(x,y)	返回 x 的 y 次幂。
random()	返回 0 ~ 1 之间的随机数。
round(x)	把数四舍五入为最接近的整数。
sin(x)	返回数的正弦。
sqrt(x)	返回数的平方根。
tan(x)	返回角的正切。
toSource()	返回该对象的源代码。
valueOf()	返回 Math 对象的原始值。

其中比较有用的方法有

向上向下取整    向上取整 Math.ceil()    向下取整 Math.floor()

随机生成随机数   Math.random()

--------------------------------------------------------------------------------------------------------------------------------

<!--随机生成数字-->
<div id="only">你选择的颜色是：</div>
<input type="button"value="请选择"οnclick="show()">
<script>
    function show(){
        /*颜色数组*/
        var colorlist = new Array("黄色","黑色","紫色","红色","白色");
        /*随机生成数字*/
        /*生成的是0到一之间的数，但不等于一所以我们乘以几就会获取获取无限小于该被乘数的随机数*/
        /*再向上取舍，是的小数变为整数*//*Math.ceil()*/
        var num = Math.ceil(Math.random()*4)+1;
        /*将数组里面的颜色通过随机生成的数字下标来获取*/
        document.getElementById("only").innerHTML="你选择的颜色是："+colorlist[num]
    }
</script>

---------------------------------------------------------------------------------------------------------------------------------

定时函数：

setTimeout( "调用的函数" ， "等待的毫秒数")；

只执行一次

setInterval( "调用的函数" , "等待的毫秒数")

周期循环执行

setInterval("调用的函数" , "等待的毫秒数")

清除定时函数：

var myTime = setTimeout("调用的函数" , "等待的毫秒数")

clearTimeout ( myTime)

var myTime = setInterval("调用的函数" , "等待的毫秒数")

clearInterval ( myTime)

这样就可以清除定时函数的周期执行

第一种（通过嵌套）
<div id="tv-colck"></div>
<input type="button" οnclick="colck()"value="时钟">
<input type="button" οnclick="stop()"value="时间停止">
<script>
    function colck(){
        var date = new Date();
        var hh = date.getHours();
        var mm = date.getMinutes();
        var ss = date.getSeconds()
        document.getElementById("tv-colck").innerHTML="当前的时间:"+hh+":"+mm+":"+ss
        setTimeout("colck()",1000)
    }
---------------------------------------------------------------------------------------
第二种（调用循环）
<div id="tv-colck"></div>
<input type="button" οnclick="colck()"value="时钟">
<input type="button" οnclick="stop()"value="时间停止">
<script>
    function colck(){
        var date = new Date();
        var hh = date.getHours();
        var mm = date.getMinutes();
        var ss = date.getSeconds()
        document.getElementById("tv-colck").innerHTML="当前的时间:"+hh+":"+mm+":"+ss
    }
    /*这个是循环执行*/

    setInterval("colck()",1000)

------------------------------------------------------------------------------------------------

 function start(){
        mytime = setInterval("showtime()",1000)
    }
    function stop(){
        clearInterval(mytime)
    }

---------------------------------------------------------------------------------------

Date进阶使用，题目要求

输出：今天是2018年5月28日   PM  8:57：00   星期二   

代码演示：

调用当前的所有时间信息（停止暂停时间）
<div id="t-clock"></div>
<input type="button"value="显示时间"οnclick="start()"/>
<input type="button" value="停止"οnclick="stop()">
<script>
    function showtime(){
        var date = new Date();
        var YYYY = date.getFullYear();
        var MM= date.getMonth();
        var dd= date.getDate();
        var hh = date.getHours()
        var mm = date.getMinutes();
        var ss = date.getSeconds();
        var week = date.getDay();
        var ap = "";
        if(parseInt(hh)>12){
            hh= parseInt(hh-12);
            ap="PM"
        }else{
            ap="AM"
        }
        document.getElementById("t-clock").innerHTML="今天是："+YYYY+"年"+(MM+1)+"月"+dd+"日"+"      "+hh+":"+mm+":"+ss+"      "+ap+"星期"+(week)
    }
        var  mytime = setInterval("showtime()",1000)
    function start(){
        mytime = setInterval("showtime()",1000)
    }
    function stop(){
        clearInterval(mytime)
    }
---------------------------------------------------------------------------------------

getAttribute("属性名")

setAttribute("属性名”  ，“属性值”）

creatElement(tagname)       创建一个标签类型为tagname的新的标签

A.appendChild.B                  把B追加到A的子数组里面

insertBefore（A , B)              把A节点追加到 B 节点的前面

cloneNode(deep)                  复制某个指定的节点

---------------------------------------------------------------------------------------
创建新的节点，替换，和删除
<input type="button"οnclick="dete()"value="删除">
<input type="button"οnclick="replace()"value="替换">
<input type="button"οnclick="deletenew()"value="删除新节点">
<img  id="first" src="baby_r.jpg" alt="0"/>
<script>
    function dete(){
        var fitst = document.getElementById("first")
        first.parentNode.removeChild(first);
    }
    function replace(){
        var first = document.getElementById("first")
        var newnode = document.createElement("div")
        newnode.setAttribute("style","background-color:red;width:100px;height:100px")
        newnode.setAttribute("id","new")
        first.parentNode.replaceChild(newnode,first)
    }
    function deletenew(){
        var newchild = document.getElementById("new")
        newchild.parentNode.removeChild(newchild)
    }


---------------------------------------------------------------------------------------