css3获取最后一个元素,一个CSSselect器来获取最后一个可见的div
你可以用JavaScript或者jQuery来select和设置它,但是CSS本身不能做到这一点。
例如,如果你在网站上实现了jQuery ,你可以这样做:
var last_visible_element = $('div:visible:last');
虽然希望你有一个包装在你select的div的class / ID,在这种情况下你的代码看起来像:
var last_visible_element = $('#some-wrapper div:visible:last');
有一个纯粹的CSS解决scheme(CSS3),如果你的div使用“样式”属性隐藏
div:not([style*="display: none"]):last-child{ /* bla */}
注意“display:”和“none”之间的空格,如果不能确切地说明属性中是否有空格,可以这样做:
div:not([style*="display:none"]):not([style*="display: none"]):last-child{ /* bla */}
jQuery是国王,但CSS3的解决scheme是上帝
我认为这是不可能的select一个CSS值(显示)
编辑:
在我看来,在这里使用一些jQuery是有意义的:
$('#your_container > div:visible:last').addClass('last-visible-div');
纯粹的JS解决scheme(例如,当你不使用jQuery或其他框架,而不想为此任务下载):
var divs = document.getElementsByTagName('div'); var last; if (divs) { for (var i = 0; i < divs.length; i++) { if (divs[i].style.display != 'none') { last = divs[i]; } } } if (last) { last.style.background = 'red'; }
这个问题的真正答案是,你不能这样做。 替代CSS的答案不是这个问题的正确答案,但是如果JS解决scheme对你来说是可以接受的,那么你应该在这里select一个JS或者jQuery的答案。 但是,正如我上面所说的,真正的,正确的答案是,除非你愿意接受:not运算符,而[style*=display:none]在内联样式上工作,是一个整体差的解决scheme。
换句话说,你可以用javascript来做,在Jquery中你可以使用类似于:
$('div:visible').last()
*重新编辑
这是不可能的CSS,但是你可以用jQuery做到这一点。
JSFIDDLE DEMO
jQuery的:
$('li').not(':hidden').last().addClass("red");
HTML:
- Item 1
- Item 2
- Item 3
- Item 4
CSS:
.hideme { display:none; } .red { color: red; }
jQuery(以前的解决scheme):
var $items = $($("li").get().reverse()); $items.each(function() { if ($(this).css("display") != "none") { $(this).addClass("red"); return false; } });
如果您可以使用内联样式,那么您可以纯粹使用CSS。
我使用这个在前一个元素可见时在下一个元素上做CSS:
div [style ='display:block;'] + table {
filter:blur(3px);
}
css3获取最后一个元素,一个CSSselect器来获取最后一个可见的div相关推荐
- 拦截器获取请求参数post_spring boot拦截器中获取request post请求中的参数
最近有一个需要从拦截器中获取post请求的参数的需求,这里记录一下处理过程中出现的问题. 首先想到的就是request.getParameter(String )方法,但是这个方法只能在get请求中取 ...
- python取数组最后一个元素_Python Json。只获取json数组中的最后一个元素
我刚开始尝试python,现在我有点左右为难.在 我试图从一个json文档打印,而我只得到数组中的最后一个元素.在[{ "FullMeasure": "1/2 cup&q ...
- java list最后一个元素_Java 8 Stream List 获取最后一个元素
在Java 8中,我们可以使用reduce或skip获取Stream的最后一个元素. 1. Stream.reduce Java8Example1.java package com.mkyong; i ...
- 微信小程序wx:for给每一个元素加事件,并获取元素内容
首先是wxml <view class='js'><view wx:for="{{adressMessages}}">/*这里是元素的内容*/<tex ...
- python删除最后一个元素_Numpy-从一维数组中删除最后一个元素的最佳方法?
NumPy数组的大小是固定的,因此不能就地移除元素.例如,使用del不起作用:>>> import numpy as np >>> arr = np.arange( ...
- php获取表单元素的值,PHP如何获取表单提交的数据
PHP如何获取表单提交的数据 1.超全局数组变量:$_GET[] 描述:获取表单 method = "get" 提交的数据 举例:$username = $_GET["u ...
- Java –获取列表的最后一个元素
在Java中,索引从0开始,我们可以通过以下公式获取list的最后一个索引: list.size() - 1 JavaExample1.java package com.mkyong.test;imp ...
- golang 获取切片 slice 第一个 最后一个 元素
复合数据类型切片通常用作Go中索引数据的口语结构. 该类型[]intSlice是具有类型为integer的元素的切片. len函数用于获取切片的最后一个元素,并从切片中删除最后一个元素. 示例如下: ...
- vector容器的end是指向最后一个元素的下一个位置,使用时要将迭代器减1,才能获取到最后一个
vector容器的end是指向最后一个元素的下一个位置,使用时要将迭代器减1,才能获取到最后一个 原因: Cont是容器的类型,容器中定义了一个此容器所用的游标(迭代器)的类型,叫iterator,于 ...
最新文章
- java如何生成唯一码_java – 如何为方法实例生成唯一的哈希码?
- 一个实用技巧,告别手动画图,自动生成数据库 ER 图|原创
- Linux入门-shell使用技巧
- 学习Spring Boot:(二十)使用 MongoDB
- Linux 第20天: (09月12日) Linux启动和内核管理
- 【今日CS 视觉论文速览】 11 Jan 2019
- php ssl扩展,php如何安装openssl扩展?
- 网关支付、银联代扣通道、快捷支付、银行卡支付分别是怎么样进行支付的?...
- 8000401a 因为配置标志不正确 错误及解决办法
- 微软蓝牙鼠标3600拆解
- 基于Qt秒表设计(Qt绘图秒表示例)
- 高等数学:对向量及其线性运算和数量积、向量积的见解
- M*LMM缩略图文件管理模式模块开发(一个含有listview和gridview浏览模式的文件管理器)
- LP Wizard10.5破解笔记
- 基于matlab模拟心电信号,附赠代码
- 在 Win10 上安装 Redis 4.0 的两种姿势
- 计算机考c语言的好不好调剂,从三跨考生到初试985调剂211心路历程
- 小区门禁卡可以复制到手机上吗_手机NFC可以复制小区用的门禁卡吗?哪些可以?哪些不可以?又该如何操作?...
- win10下如何查看自己的显卡型号
- Java素数求和(1~100)
热门文章
- 少儿Python编程_第十八讲 搭建网站
- (一) ES6 新特性 ——let与const关键字
- Ubuntu 18.04双系统安装教程-超详细(原系统Win7,解决安装完成后启动Ubuntu进入GLUB的问题)
- English Learning - L2 语音作业打卡 助动词弱读 Day58 2023.4.19 周三
- Java 类与对象以及接口
- 如何正确使用redis
- 一路风景尽收眼底—2015年度总结
- 牛客-顺时针旋转矩阵
- 【Ei检索】2022年计算语言学和自然语言处理国际会议(CLNLP 2022)
- vue seo管理 vue-meta-info 动态设置meta和title