代码如下：

<head>里： 导入jQuery包： <script type="text/javascript" src="js/jquery-3.5.1.min.js" ></script> <script type="text/javascript"> $(function(){ $("span").click(function(){ // $(this) : 当前点击的对象 $(this).siblings().show().parent().siblings().children("li").hide(); }) }); </script> <body>里：内容 <ul><span>水果</span> <li>苹果</li> <li class="c1">橘子</li> <li>梨子</li> <li>香蕉</li> </ul> <ul><span>化妆品</span> <li>口红</li> <li id="i1">眼影</li> <li class="c1">腮红</li> <li>高光</li> </ul> <ul><span>护肤品</span> <li>水</li> <li class="c1">乳</li> <li>霜</li> <li>精华</li> </ul>

jQuery作业 点击显示的更多相关文章

  1. jQuery - 制作点击显示二级菜单效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. jquery Mobile点击显示加载等待效果

    点击某个按钮或链接时,触发等待加载效果: <script> <!-- $(document).bind("mobileinit", function(){ }); ...

  3. jquery实现点击显示，再点击隐藏

    //点击a标签,轮流显示和隐藏<div id="timo" style="background-color:red;height:50px;width:50px;& ...

  4. jQuery 点击显示再次点击隐藏

    <html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...

  5. 基于Jquery UI的autocompelet改写，自动补全控件，增加下拉选项，动态设置样式，点击显示所有选项，并兼容ie6+

    Jquery UI的autocompelete改写 注意:实现功能,除了原版的自动补全内容外,增加一个点击显示所有选项,样式能动态设置. 加载数据的来源为后台数据库读取. 具体代码如下: 引用 从官方 ...

  6. jquery实现点击控制div的显示和隐藏

    我们使用点击显示.点击隐藏的时候,一般有两种可选方案 .示例 html <div class="index"> <h1> 首页 </h1> &l ...

  7. jQuery 二级菜单，一次显示一个小类 鼠标点击显示小类

    jQuery 二级菜单,一次显示一个小类 鼠标点击显示小类 本例有另外2个关联案例,演示地址分别为2.php,3.php 演示 XML/HTML Code <div class="ar ...

  8. 锋利的Jquery(点击显示隐藏div)

    点击显示隐藏div <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  9. jquery 点击显示更多

    点击显示更多 html <div class="servicepicture banxin"> <div class="imgcontent" ...

随机推荐

  1. Spring 源码学习 04：初始化容器与 DefaultListableBeanFactory

    前言 在前一篇文章:创建 IoC 容器的几种方式中,介绍了四种方式,这里以 AnnotationConfigApplicationContext 为例,跟进代码,看看 IoC 的启动流程. 入口 从 ...

  2. Django----Modelviewset继承

    1.modelviewset 认证.权限.限流.序列化.分页.过滤.排序 modelviewset的应用场景是: 1.主要应用于数据接口 2.对数据库的增删改查 3.在视图函数中没有很多业务逻辑需要来 ...

  3. JZOJ2020年8月11日提高组T2 宝石

    JZOJ2020年8月11日提高组T2 宝石 题目 Description 见上帝动了恻隐之心,天后也想显示一下慈悲之怀,随即从口袋中取出一块魔术方巾,让身边的美神维纳斯拿到后堂的屏风上去试试,屏风是 ...

  4. 【GDOI2014模拟】JZOJ2020年8月14日提高组 服务器

    [GDOI2014模拟]JZOJ2020年8月14日提高组 服务器 题目 Time and Memory Limits Description 我们需要将一个文件复制到n个服务器上,这些服务器的编号为 ...

  5. 如何将图片、html等格式转成pdf

    const int WWidth = 600; const int HHeight = 800; List<System.Drawing.Image> AllName = new List ...

  6. Boost随机库的简单使用：Boost.Random(STL通用)

    文章目录 文章目录 文章内容介绍 Boost随机库的简单使用 生成一个随机的整数 生成一个区间的平均概率随机数 按概率生成一个区间的随机整数 一些经典的分布 与STL的对比 Ref 文章内容介绍 Bo ...

  7. 第2.2节 Python的语句

    上节已经介绍了极简的Python代码编写,已经用到了赋值语句,本节对Python的程序语句进行介绍. 一. 常用命令 在介绍Python语句之前,先介绍一下几个有用的Python命令. dir(模块名 ...

  8. Shiro remeberMe反序列化漏洞复现（Shiro-550）

    Apache Shiro是一个强大易用的Java安全框架,提供了认证.授权.加密和会话管理等功能.Shiro框架直观.易用,同时也能提供健壮的安全性.在Apache Shiro编号为550的 issu ...

  9. CloudIDE插件开发实战：教你如何调试代码

    摘要:今天我们来重点介绍下CloudIDE插件的调试技巧,在插件开发过程中调试作为重要的问题分析和定位手段能够有效帮助开发者提升插件质量. 今天文章中的样例工程我们继续以上一篇<实战CloudI ...

  10. Springboot集成xxl-Job

    一.前言 xxl-job一个轻量级的分布的调度中间件,详情介绍自己到官网看:https://www.xuxueli.com/xxl-job/ 二.客户端(执行器) 引入依赖compile group: ...