代码如下：

<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. 网络拓扑实例10：MSTP+VRRP组合组网

    组网图形 MSTP+VRRP组合简介 网络中部署VRRP负载分担时,多台设备同时承担业务,每个虚拟设备都包括一个Master设备和若干个Backup设备.如果为了接入备份需要同时部署冗余链路,则需要部 ...

  2. PyQt(Python+Qt)学习随笔：视图中的拖放操作注意事项

    老猿Python博文目录 老猿Python博客地址 在通过PyQt构建的图形界面中进行拖放,要成功进行拖放需要注意: 视图相关属性需要支持拖放,具体相关属性请参考<PyQt(Python+Qt) ...

  3. Mybatis04

    title: Mybatis学习04 date: 2020-01-20 21:48:00 tags: 这次的笔记主要是mybatis中的注解 1.实体类的注解 实体类的注解在mybati的XML文件中 ...

  4. Oracle表操作-创建及增删改查

    数据类型: 1.CHAR:定长字符类型,默认长度是1,最长不超过2000字节. 2.CARCHAR2(length):可变字符类型,默认长度是1,最长不超过4000字符. 3.NUMBER(P,S): ...

  5. PHP代码审计分段讲解（4）

    08 SESSION验证绕过 源代码为: <?php ​ $flag = "flag"; ​ session_start(); if (isset ($_GET['passw ...

  6. [Windows] Prism 8.0 入门（下）：Prism.Wpf 和 Prism.Unity

    1. Prism.Wpf 和 Prism.Unity 这篇是 Prism 8.0 入门的第二篇文章,上一篇介绍了 Prism.Core,这篇文章主要介绍 Prism.Wpf 和 Prism.Unity ...

  7. jquery和zepto有何区别？

    1.针对移动端程序,Zepto有一些基本的触摸事件可以用来做触摸屏交互(tap事件.swipe事件),Zepto是不支持IE浏览器的. 2.DOM操作的区别:添加id时jQuery不会生效而Zepto ...

  8. Acwing 393. 雇佣收银员

    算法1: 差分约束 + 枚举 O(Tn2028) 由于牵扯到 \([i - 8 + 1, i]\) 这段区间的和的约束,所以用前缀和更好表达一些. 设 \(num[i]\)表示 \(i\) 时刻有多少 ...

  9. 【MindSpore】Ubuntu16.04上成功安装GPU版MindSpore1.0.1

    本文是在宿主机Ubuntu16.04上拉取cuda10.1-cudnn7-ubuntu18.04的镜像,在容器中通过Miniconda3创建python3.7.5的环境并成功安装mindspore_g ...

  10. Vue-组件化，父组件传子组件常见传值方式

    前言 我们都知道vue核心之一:组件化,vue中万物皆组件,组件化我认为应该来至于模块化的设计思想,比如在模块化开发中,一个模块就是一个实现特定功能的独立的文件,有了模块我们就更方便去阅读代码,更方便 ...