js仿百度音乐全选操作
作者：光明大神棍 发布时间：2024-04-18 10:03:41
标签：js,全选
本文实例为大家分享了js全选操作的具体代码，供大家参考，具体内容如下
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
*{margin:0;padding:0;}
ul{list-style:none;}
#content{width:300px;border:1px solid #ccc;margin:20px auto;}
#content ul{width:300px;}
#content ul li,#content div{width:300px;height:50px;line-height:50px;border-bottom:1px dotted #ccc;text-indent:20px;}
#content ul li:nth-child(odd) {background:#f1f1f1;}
#content ul li.active,#content ul li:hover{background:#99FFCC;}
</style>
<script>
window.onload = function () {
var oDiv = document.getElementById('content');
var checkAll = document.getElementById('checkAll');
var aLi = oDiv.getElementsByTagName('li');
var aInput = oDiv.getElementsByTagName('input');
for ( var i = 0; i < aInput.length; i++ ) {
aInput[i].index = i;
aInput[i].onclick = function () {
aLi[this.index].className = this.checked ? 'active' : '';
}
}
checkAll.onclick = function () {
for ( var i = 0; i < aInput.length; i++ ) {
if(!aInput[i].checked) aInput[i].checked = true;
aLi[i].className = 'active';
}
}
}
</script>
</head>
<body>
<div id="content">
<ul>
<li>
<input type="checkbox"/>
<span>私奔</span>
<span>梁博</span>
</li>
<li>
<input type="checkbox"/>
<span>北京</span>
<span>杜甫</span>
</li>
<li>
<input type="checkbox"/>
<span>花人</span>
<span>李白</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
<li>
<input type="checkbox"/>
<span>神话</span>
<span>光良</span>
</li>
</ul>
<div>
<input id="checkAll" type="checkbox" />全选
</div>
</div>
</body>
</html>
0
投稿猜你喜欢
- 1. 编码问题：遇到了几个字符串转换问题，总结如下：# str to bytes str.encode(s)# bytes to str b
- 在编写python函数时，无意中发现一个问题：python中的变量不能以数字打头，以下函数中定义了一个变量3_num_varchar，执行时
本文实例讲述了Python大数据之从网页上爬取数据的方法。分享给大家供大家参考，具体如下：myspider.py ：#!/usr- 线性回归是机器学习中的基础算法之一，属于监督学习中的回归问题，算法的关键在于如何最小化代价函数，通常使用梯度下降或者正规方程（最小二乘法），
- 本文实例讲述了python和bash统计CPU利用率的方法。分享给大家供大家参考。具体如下：开始的时候写了一个 bash 的实现；因为最近也
- Oracle的Nvl函数nvl( ) 函数从两个表达式返回一个非null 值。语法NVL(eExpression1, eExpression
- 目录1. 序列2. 列表2.1 列表的特性2.1.1 列表的连接操作符和重复操作符2.1.3 列表的索引2.1.4 列表的切片2.1.5 列
- 最近ChatGpt异常火热，访问网站经常会出现1020的错误代码，或无法访问。大概率是因为服务器压力大，网关返回的1020错误码，只能等待官
- python怎么打印菱形？下面给大家带来三种方法：第一种rows = int(input('请输入菱形边长：\n'))row
- 前言本文介绍的主要内容是 Redux-Toolkit 在 React + TypeScript 大型应用中的实践，主要解决的问题是使用 cr
- 我们知道，session是一种会话技术，用来实现跨脚本共享数据或者检测跟踪用户状态。session的工作原理（1）当一个session第一次
- 装饰器(decorator)是一种高级Python语法。装饰器可以对一个函数、方法或者类进行加工。在Python中，我们有多种方法对函数和类
- 一、背景1.项目描述你拥有一个超市(Supermarket Mall)。通过会员卡，你用有一些关于你的客户的基本数据，如客户ID，年龄，性别
- 1、有时候我们可能想让字符串倒序输出，下面给出几种方法方法一：通过索引的方法>>> strA = "abcdeg
- 对比Google Chrome、IE来说，在Windows环境下，Firefox 3.5的启动速度非常慢，据说是因为Firefox 3.5从
- 一、介绍我想做的是基于人脸识别的表情（情绪）分析。看到网上也是有很多的开源库提供使用，为开发提供了很大的方便。我选择目前用的比较多的dlib
- 第一章：霍夫变换检测圆① 实例演示1这个是设定半径范围 0-50 后的效果。② 实例演示2这个是设定半径范围 50-70 后的效果，因为原图
- 需要准备的工具：SQL Query Analyzer和SqlExec Sunx Version第一部分：去掉xp_cmdshell保护系统的
- 动态链接库在Windows中为.dll文件，在linux中为.so文件。以linux平台为例说明python调用.so文件的使用方法。本例中
- SELECT (case when a.colorder=1 then d.name else '
