代码如下：

<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. ubuntu安装vmware

    安装过程: 首先直接将光盘文件中的tar.gz复制到桌面,解压过程如下 中间遇到的问题: 在执行的过程中一直在回车,需要输入的全为yes,还有一个是what is the location of th ...

  2. 解决 spring-integration-mqtt 频繁报 Lost connection 错误

    问题描述 在之前的博客介绍了如何在 Spring Boot 集成 MQTT,后面使用中没有发现问题,最近发现一直报错: Lost connection: Connection lost; retryi ...

  3. .Net编码规范整理

    前言 此处只是整理并记录下.Net开发规范以便加深编码规范.一个好的编程规范可以让自己程序可读性,让自己编码更规范,分为两部分:通用规范..Net开发规范. 微软通用编程规范 明确性和一致性 库的使用 ...

  4. Python正则表达式\W+和\W*匹配过程的深入分析

    在学习re.split函数的处理过程中,发现执行如下语句及返回与老猿预想的不一致: >>> re.split('\W*','Hello,world') ['', 'H', 'e', ...

  5. js将秒数转换为时分秒格式

    function secondToTimeStr(t) { if (!t) return; if (t < 60) return "00:" + ((i = t) < ...

  6. SQL直接生成实体属性，简单粗暴型

    在java开发中,不可避免的要碰到根据表生成对应的实体,这个过程是比较机器且繁琐的,我也用过一些逆向工程的工具,比如IDEA自带的生成实体,还有网上开源的工具,用起来也是可以的. 我现在开发用的持久层 ...

  7. Java的字符串操作一些简单的思考

    Java的字符串操作 1 .1不可变的String String对象事不可变的,String类中的每一个看起来会修改String值的方法,实际上都是创建了一个全新的String对象,以包含修改后的字符 ...

  8. Robot Framework+adb框架自动化测试Android设备案例⑸——L1层测试用例

    一.L1层测试用例 1.初始化.robot *** Settings *** Resource ../L2层关键字.robot *** Test Cases *** 切换EMMC模式 [Tags] A ...

  9. uni-app微信小程序登录授权

    微信小程序授权是非常简单和常用的功能,但为了方便,还是在此记录一下要点: 首先是需要用到一个授权按钮来触发获取用户信息授权: 关键在于 open-type 为 getUserInfo , 然后有个@g ...

  10. 设置定时任务用rman删除归档日志脚本

    之前使用数据库数据迁移过程中出现产生大量归档日志的情况(由于迁移的目标库是DG,必须开启归档). 为避免出现归档空间爆掉的情况,设置定时任务删除系统当前时间30分钟前的归档日志,脚本如下: cat d ...