<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script src="js/jquery-2.2.4.min.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">

            $(function() {

                //$(this)  点击哪个li  $(this)就代表哪个li

                //siblings()   表示当前选中的li的兄弟

                $("li").click(function() {

                    $(this).css("background-color","pink");

                    $(this).siblings().css("background-color","white");

                });

            });

        </script>

    </head>

    <body>

        <ul>

            <li>第一个li</li>

            <li>第二个li</li>

            <li>第三个li</li>

            <li>第四个li</li>

            <li>第五个li</li>

            <li>第六个li</li>

        </ul>

    </body>

</html>

点击li 该li变色的更多相关文章

  1. jquery怎么在点击li标签之后添加一个在class，点击下一个li时删除上一个class？

    思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...

  2. 遍历ul下的li，点击弹出li的索引

    首先我们需要一个html结构 <div > <ul> <li>a</li> <li>a</li> <li>a< ...

  3. 点击事件获得li标签内容

    通过点击事件获得li标签内容 Table of contents 随笔 随笔 <li onclick="liClick(this)">数据</li> //点 ...

  4. jquery点击li标签之后在该li标签上添加一个class，点击下一个li时删除上一个li的class

    思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class 具体演示如下: 1.HTM ...

  5. 点击页面li显示li中文字

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. 利用React遍历数组，并且用数组的元素生成<li>arrItem</li>标签组

    var numbers = [1,2,3,4,5,6,7,8,9]; ReactDom.render({ <ul> { numbers.map(function(item){ return ...

  7. li 与 li 之间有空白间隔是什么原因引起的，有什么解决办法

    li 与 li 之间有空白间隔是什么原因引起的,有什么解决办法 原因 浏览器会把inline元素间的空白字符(空格.换行.Tab等)渲染成一个空格.而为了美观,我们通常是一个 放在一行,这导致 换行后 ...

  8. 点击弹出li所在的序列号

    最近在研究一个图片替换功能,及点击左侧商品在右侧弹出层修改图片后,同时左侧的图片也得跟着修改. 我原来考虑的添加ID作为唯一值.但当ID重复了,替换就出BUG了. 最后问公司同事,然后给提供了 根据点 ...

  9. Jquery的hover方法让鼠标经过li时背景变色

    来源地址:http://itfish.net/article/29790.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...

  10. Div+CSS+JQuery实现选项卡，即通过点击不同的li跳转到不同的div中显示不同的内容或者执行不同的操作。

    1.代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>   ...

随机推荐

  1. CNCF 沙箱项目 OCM Placement 多集群调度指南

    ​简介:在这篇文章中,将介绍 Placement 如何选择到所需的集群,Placement 可以提供的调度功能,以及一些场景下的最佳实践,使用者可以参考示例来编写符合自己要求的 Placement.其 ...

  2. ACK正式支持对基于Alibaba Cloud Linux操作系统的集群进行等保加固

    简介: 我们对基于Alibaba Cloud linux操作系统的ACK集群进行等保加固,意味着阿里云在云产品开发和交付的过程中将安全作为重要组成部分,将合规融入到产品的"血液"中 ...

  3. Hologres揭秘：高性能原生加速MaxCompute核心原理

    简介: Hologres技术揭秘系列持续更新中,本期我们将带来Hologres高性能原生加速查询MaxCompute的技术原理解析. Hologres(中文名交互式分析)是阿里云自研的一站式实时数仓, ...

  4. [Go] Viper 加载项目配置，go build 打包配置文件进二进制

    Viper 的传统用法局部,加载到某个 package 下的全局变量后,其它 package 可以继续使用. var Conf *viper.Viper func init() { // File n ...

  5. WPF 对接 Vortice 调用 WIC 加载图片

    本文将告诉大家如何通过 Vortice 库从底层的方式使用 WIC 层加载本地图片文件,解码为 IWICBitmap 图片,然后将 IWICBitmap 图片交给 WPF 进行渲染 本文的前置博客:W ...

  6. dotnet 教你写一个可以搞炸本机所有 WCF 应用的程序方法

    作为团队里面挖掘机出身的我,怎么能不多挖一些坑好将小伙伴们都埋进去呢.本文来告诉大家一个有趣且简单的方法,此方法可以将本机的 WCF 玩坏,不敢说真的搞炸本机所有 WCF 应用,但搞炸大部分基于 WC ...

  7. dotnet 读 WPF 源代码笔记 了解 WPF 已知问题 用户设备上不存在 Arial 字体将导致应用闪退

    本文来告诉大家 WPF 已知问题,在用户的设备上,如果不存在 Arial 字体,同时安装了一些诡异的字体,那么也许就会让应用在使用到诡异的字体的时候,软件闪退 在 WPF 的 FontFamily.c ...

  8. 用 C# 写脚本 如何输出文件夹内所有文件名

    大部分在 Windows 下的脚本都是使用 bat 或 cmd 写的,这部分的脚本对我来说可读性不好.这个可读性也是很主观的,对我来说用 C# 写脚本的可读性很强,但是换个小伙伴就不是了.在 .NET ...

  9. golang中三种定时器的实现方式及周期定时

    一.定时器的创建 golang中定时器有三种实现方式,分别是time.sleep.time.after.time.Timer 其中time.after和time.Timer需要对通道进行释放才能达到定 ...

  10. Ubuntu Snap 简述

    Ubuntu Snaps Ubuntu Snaps 是 Ubuntu 的母公司 Canonical 于 2016 年 4 月发布 Ubuntu16.04 LTS(LongTermSupport,长期支 ...