原生js的时间对象和修改背景图片

本文介绍了如何在JavaScript中获取当前时间对象,并展示了如何利用随机数动态修改页面背景图片,为前端开发提供了一个实用技巧。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、获取时间对象,记录当前时间

<body>
    <button>点击</button>
    <p>123</p>

    <script>
        let p = document.querySelector("p")
        let btn = document.querySelector("button")
        btn.onclick = function () {
            p.innerText=getDate()
        }

        function getDate() {
            let date = new Date()
            let year = date.getFullYear()
            let mouth = date.getMonth() + 1
            let dates = date.getDate()
            let arr = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日',]
            let day = date.getDay() //4   下标
            return '今天是:' + year + "年" + mouth + "月"+ dates+ "日" + arr[day] 
        }


    </script>


</body>

效果:

 2、随机数修改背景图片

/**
 *
 * 实现指定区间的随机整数(闭区间)
 * @param {number} n, 代表区间的一端
 * @param {number} m, 代表区间的另一端
 *
 * @return {number} , 指定区间的随机整数
*/
function myRandom(n,m) {
    // 1. 考虑数字的安全: 必须是数字才可以, 否则不行, 用户必须给一个数(实参)
    m = m || 0          // m可以没有值, 没有值,将值变成0

    // 2. 重新确定n和m的大小关系
    let min = Math.min(n, m)
    let max = Math.max(n, m)

    return Math.floor(Math.random() * (max - min + 1)) + min

}

引入与使用

 <title>Document</title>
//引入
    <script src="./myRandow.js"></script>
</head>

//使用
<img src="./images/b1.jpg" alt="">
  
    <script>
//封装一个函数
        function repeat() {
            let rand = myRandom(1, 5)

            let img = document.querySelector('img')
            img.src = `./images/b${rand}.jpg`
        }


//每隔一段时间调用这个函数
        setInterval(repeat, 500)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值