1.4JavaScript 弹出框与内置对象

作者: 1983年的古董先生 | 来源:发表于2017-07-26 13:38 被阅读0次

1.4JavaScript 弹出框与内置对象
javascript01
word 中怎么插入 excel表格
2018-10-13Bootstrap09
弹出提示框和自动消失
react-native自定义对话框弹出框组件dialogs
WKWebView使用中遇到的坑
vue-弹出框组件
MUI中等待框的H5实现
解决 ng-zorro-antd 升级后 [Modal对话框]

消息框

1.警告框
alert（）；

2.确认框
confirm（）；
<script>
confirm('你确认删除吗？');
</script>
3.提示框
prompt('请输入图片的名字');

JavaScript内置对象
JavaScript对象 :1. js内置对象、js事件对象、3.BOM浏览器对象、4.DOM文档对象。

1.数学
属性:
Math.Pi

方法：
    Math.ceil();取上一个整数
    Math.floor();去下一个整数
    Math.round();四舍五入     
    Math.random();随机数
<script>
arr  =['a.png','b.png','c.pmg','d.png','e.png'];
    rand = Math.random();
    tot = arr.length;
    sub = Math.ceil(rand*tot);
    alert(arr[sub]);
</script>
    Math.max();最大数
    Math.min();最小数

2.日期
    1.生成对象
    dobj=new Date();
    2.方法
    getFullYear();
    getMonth();
    getDate();
    getHours();
    getMinutes();
    getSeconds();
例子一 日期获取对象：
dobj = new Date();
    year = dobj.getFullYear();
    month= dobj.getMonth()+1;
    day = dobj.getDate();
    hour =dobj.getHours();
    minute = dobj.getMinutes();
    seconds =dobj.getSeconds();
str=year+'-'+month+'-'+day+'-'+hour+':'+minute+':'+seconds;
    alert(str);
-------------------------------------------------------
例子二
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>1-秒表</title>
    <style>
        .clock{
            width: 200px;
            height: 50px;
            background-color: darkcyan;
            color: white;
            font-weight:bold;
            border-radius: 50px;
            text-align: center;
            line-height: 50px;
            margin: 100px auto;
        }
    </style>
</head>
<body>
<div class="clock">
<span id="sid"></span>

</div>
</body>
<script>
    //时间对象
    function getDate(){
        dobj = new Date();
        year = dobj.getFullYear();
        month= dobj.getMonth()+1;
        day = dobj.getDate();
        hour =dobj.getHours();
        minute = dobj.getMinutes();
        seconds =dobj.getSeconds();
        str=year+'-'+month+'-'+day+'-'+hour+':'+minute+':'+seconds;
       //获取时间对象
        sidobj = document.getElementById('sid');
        sidobj.innerHTML = str;
    }
    getDate();
    //设置定时器对象
    setInterval(function(){
        getDate();
    },1000);
</script>
</html>

![7.png](https://img.haomeiwen.com/i6520082/3138285826e0200f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

例子三
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>1-计时器</title>
    <style>
        .clock{
            width: 100%;
            height: 50px;
            background-color: darkcyan;
            color: white;
            font-weight:bold;
            border-radius: 50px;
            text-align: center;
            line-height: 50px;
            margin: 100px auto;
        }
    </style>
</head>
<body>
<div class="clock">
<span > 提交成功<span id="sid">3</span> s后页面即将跳转</span>
</div>
</body>
<script>
    //时间对象
    sobj = document.getElementById('sid');
       s=3;
    setInterval(function(){
        s--;
        if (s<=0){
            window.location='https://www.baidu.com/';
        }
        else{
            sobj.innerHTML =s;
        }
    },1000)
</script>
</html>

3.定时器
设置定时器
s1 = setlnterval(函数，3)；
清除定时器
clearlnterval(s1);

4.超时器
1.定义
tobj=setTimeout(func,1000);
2.清除
ClearTimeout(tobj);

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>1-(超时器)计时器</title>
    <style>
        .clock{
            width: 100%;
            height: 50px;
            background-color: darkcyan;
            color: white;
            font-weight:bold;
            border-radius: 50px;
            text-align: center;
            line-height: 50px;
            margin: 100px auto;
        }
    </style>
</head>
<body>
<div class="clock">
<span > 提交成功<span id="sid">3</span> s后页面即将跳转</span>
</div>
</body>
<script>
    //时间对象
    sobj = document.getElementById('sid');
    setTimeout(function(){
       location='https://www.baidu.com/';

    },3000)
</script>
</html>