docs/开发文档/javascript/javascript工具集.md

计算文件md5

const md5 = CryptoJS.algo.MD5.create()
// 以二进制的方式读取文件,每次读取一定字节块
md5.update(a)
md5.finalize().toString(CryptoJS.enc.MD5)

原生js发起http请求

//客服端发起请求,接受服务器返回的json数据
 fetch('http://example.com/request')
        .then(response => {
            if (!response.ok) {
                throw new Error('Network response was not ok');
            }
            return response.json();
        })
        .then(data => {
            console.log(data); // 这里处理返回的JSON数组  
            }
        })
        .catch(error => {
            console.error('There has been a problem with your fetch operation:', error);
        });

重新加载网页

//重新加载名为example_frame的框架页面
window.frames['example_frame'].location.reload(true);
//重新加载当前页面
location.reload();
//重新加载页面的客户端部分（不包括服务器端脚本）
location.assign(location.href);|

修改元素的属性

//修改id_name的边框为2px
document.getElementById('id_name').style.border='2px'

修改网页内容

//innerHTML可以添加html元素
document.getElementById('id_name').innerHTML=''
//textContent只能添加纯文本
document.getElementById('id_name').textContent

生成随机数

//生成10以内的随机数
Math.floor(Math.random() * 10) + 1
//Math.random()生成一个随机浮点数
//Mate.floor()将浮点数向下取整,变成一个整数

分钟倒计时

<h3 id="countdown">02:00</h3>
<button type="button" class="btn btn-primary" id="startCountdown">开始计时</button>

// 抽奖二维码倒计时功能
    let countdownElement = document.getElementById('countdown');
    let minutes = '02'; // 将分钟初始化为字符串形式  
    let seconds = '00'; // 将秒初始化为字符串形式  
    let intervalIds;
    let timer;
    let isPause = false;
    const toggleButton = document.getElementById('startCountdown')
    //开始计时
    function startCountdown() {
        intervalIds = setInterval(updateCountdown, 1000);
    }
    //更新计时器
    function updateCountdown() {
        if (minutes === '00' && seconds === '00') {
            clearInterval(intervalIds); // 停止计时器  
            countdownElement.textContent = '00:00';
            return;
        }
        seconds = parseInt(seconds) - 1; // 将秒转换为整数进行减法运算  
        if (seconds < 0) {
            minutes = parseInt(minutes) - 1; // 将分钟转换为整数进行减法运算  
            seconds = 59;
        }
        // 只对个位数分钟进行补零操作，并且只在倒计时进行到个位数分钟时才补零  
        if (minutes < 10 && minutes > -1 && seconds === '00') {
            minutes = "0" + minutes;
        } else {
            minutes = minutes.toString().padStart(2, '0'); // 其他情况下保证分钟为两位数  
        }
        if (seconds < 10) {
            seconds = "0" + seconds; // 秒小于10时在前面补零  
        }
        countdownElement.textContent = `${minutes}:${seconds}`;
    }

    // document.getElementById('startCountdown').addEventListener('click', startCountdown);
    toggleButton.addEventListener('click', () => {
        if (isPause) {
            isPause = false;
            clearInterval(intervalIds);
            toggleButton.textContent = '继续计时'; // 修改按钮文本为"Pause"  
        } else {
            isPause = true;
            toggleButton.textContent = '结束计时'; // 修改按钮文本为"Resume"  
            startCountdown()
        }
    });

显示或隐藏元素

<div id="qrImage" style="display: none;">
    <image src="https://example.com/example.png"></image>
</div>

var divElement = document.getElementById("qrImage");
if (divElement.style.display === "none") {
    divElement.style.display = "block"; // 显示div元素  
} else {
    divElement.style.display = "none"; // 隐藏div元素  
}