125 lines
4.0 KiB
Markdown
125 lines
4.0 KiB
Markdown
|
|
### 计算文件md5
|
|
|
|
```javascript
|
|
const md5 = CryptoJS.algo.MD5.create()
|
|
// 以二进制的方式读取文件,每次读取一定字节块
|
|
md5.update(a)
|
|
md5.finalize().toString(CryptoJS.enc.MD5)
|
|
```
|
|
# 原生js发起http请求
|
|
```js
|
|
//客服端发起请求,接受服务器返回的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);
|
|
});
|
|
```
|
|
# 重新加载网页
|
|
```js
|
|
//重新加载名为example_frame的框架页面
|
|
window.frames['example_frame'].location.reload(true);
|
|
//重新加载当前页面
|
|
location.reload();
|
|
//重新加载页面的客户端部分（不包括服务器端脚本）
|
|
location.assign(location.href);|
|
|
```
|
|
# 修改元素的属性
|
|
```js
|
|
//修改id_name的边框为2px
|
|
document.getElementById('id_name').style.border='2px'
|
|
```
|
|
# 修改网页内容
|
|
```js
|
|
//innerHTML可以添加html元素
|
|
document.getElementById('id_name').innerHTML=''
|
|
//textContent只能添加纯文本
|
|
document.getElementById('id_name').textContent
|
|
```
|
|
# 生成随机数
|
|
```js
|
|
//生成10以内的随机数
|
|
Math.floor(Math.random() * 10) + 1
|
|
//Math.random()生成一个随机浮点数
|
|
//Mate.floor()将浮点数向下取整,变成一个整数
|
|
```
|
|
# 分钟倒计时
|
|
|
|
```html
|
|
<h3 id="countdown">02:00</h3>
|
|
<button type="button" class="btn btn-primary" id="startCountdown">开始计时</button>
|
|
```
|
|
```js
|
|
// 抽奖二维码倒计时功能
|
|
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()
|
|
}
|
|
});
|
|
```
|
|
# 显示或隐藏元素
|
|
```html
|
|
<div id="qrImage" style="display: none;">
|
|
<image src="https://example.com/example.png"></image>
|
|
</div>
|
|
```
|
|
```js
|
|
var divElement = document.getElementById("qrImage");
|
|
if (divElement.style.display === "none") {
|
|
divElement.style.display = "block"; // 显示div元素
|
|
} else {
|
|
divElement.style.display = "none"; // 隐藏div元素
|
|
}
|
|
``` |