雷盟-前端-20230111 - 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

<script>
// 获取dom节点
const time = document.querySelector('#time');
const add = document.querySelector('#add');
const work = document.querySelector('#work');
const text = document.querySelector('#text');
const ul1 = document.querySelector('#ul1');
const ul2 = document.querySelector('#ul2');
const lis = document.querySelectorAll('li');
const ipt = document.querySelector('input');
const laji = document.querySelector('.laji');
const wanBtn = document.querySelector('#wanBtn');
const set = document.querySelector('#set');
const xuan = document.querySelector('.xuan');
// 封装星期
function getWeekDate(time = new Date()) {
let weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")
let date = new Date(time);
let day = date.getDay();
return weeks[day];
};
// 封装日期
function getMD(sep = "月") {
let date = new Date();
let m = date.getMonth() + 1;
let d = date.getDay() + 8;
return [m, d].join(sep);
};
// 将日期和星期渲染到time盒子里
time.textContent = getMD() + "日" + " " + getWeekDate();
// 给add盒子添加点击事件
add.addEventListener('click', function () {
bianji.style.display = "block";
});
let html="";
var arr=JSON.parse(localStorage.getItem("history"))||[];
var arr = [];
wanBtn.addEventListener('click', function () {
var li = document.createElement('li');
ul1.innerHTML += ` <li>
<input type="checkbox" class="xuan">
<div id="text">${set.value}</div>
<span class="iconfont icon-lajitong laji"></span>
</li>
`;
// 将输入的内容添加到本地储存
let iptVal = set.value;
arr.push(iptVal);
let arrStr = JSON.stringify(arr);
localStorage.setItem('history', arrStr);
// 将输入框隐藏
bianji.style.display = "none";
});
ul1.addEventListener('click', function (e) {
if (e.target.className == "iconfont icon-lajitong laji") {
ul1.removeChild(e.target.parentNode);
console.log(11);
let iptVal =e.target.previousElementSibling.textContent;
//arr.push(iptVal);
//let arrStr = JSON.stringify(arr);
localStorage.removeItem('history', iptVal);
} else if (e.target.className == "xuan") {
if (e.target.style.checked = "true") {
ul1.removeChild(e.target.parentNode);
ul2.appendChild(e.target.parentNode);
}
}
});
ul2.addEventListener('click', function (e) {
if (e.target.className == "iconfont icon-lajitong laji") {
ul2.removeChild(e.target.parentNode);
console.log(11);
let iptVal =e.target.previousElementSibling.textContent;
// arr.push(iptVal);
// let arrStr = JSON.stringify(arr);
localStorage.removeItem('history', iptVal);
} else if (e.target.className == "xuan") {
if (e.target.style.checked = "false") {
ul2.removeChild(e.target.parentNode);
ul1.appendChild(e.target.parentNode);
}
}
});
</script>

复制代码