todolist源码（原生JavaScript实现todolist）

最新推荐文章于 2024-04-08 08:51:57 发布

置顶

Jason Conlin

最新推荐文章于 2024-04-08 08:51:57 发布

阅读量374

点赞数

文章标签： html5 css javascript

本文链接：https://blog.csdn.net/weixin_46103538/article/details/115939988

版权

本文详细介绍了如何使用原生HTML5、CSS和JavaScript实现一个todolist应用。从效果图展示到HTML结构设计，再到CSS样式设置和JavaScript功能实现，全方位解析整个过程。

摘要由CSDN通过智能技术生成

效果图

在这里插入图片描述

HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	</head>
	<body>
		<header>
			<section>
				<p>ToDoList</p>
				<input type="text" placeholder="添加ToDo">
			</section>
		</header>
		<div id="underway">
			<h2>正在进行<span id="progress">0</span></h2>
			<ul id="list">
				<li class="pattern">
					<input type="checkbox" class="check">