jQuery根据style筛选元素
<div style="display:block;">
<input/>
</div>
<div style="display:none;">
<input/>
</div>
如上的两个input元素,获取两个input元素,常规的按index、id或判断等形式也能实现,但是很麻烦,可以用以下办法
$(".div[style='display:block;'] input")
注意“;”分号不能省略.
这里的style是指元素的style属性,并非css属性,否则如下改变之后同样的方法获取元素会失效
if($(this).css("display")=='none'){
$(this).attr('display','block');
}else{
$(this).css('display','none');
}
如要操作css属性,可选用attr方法,如
if($(this).css("display")=='none'){
$(this).attr('style','display:block;');
}else{
$(this).attr('style','display:none;');
}
如欲详细了解css属性与元素属性,请移步@参考文章,原文全文如下
使用jquery的.attr( )方法去给div隐藏,这样写的 $("#div_id").attr("display","none"),发现并没有生效,但是docunment.getElementById("div_id").style("display","none")就生效了。 而且再调试的时候发现,使用$("#div_id").attr("width","180")也是生效的....
原因:应该写成 $("#div_id").css("display","none")
display属于css中的属性,而不属于该div的属性,而width既是div的属性,也是css的属性,所以会出现上面的情况,以后再使用jquery去修改某一标签的style 使用css( ),修改元素的属性 使用attr( )。
总结:
attr(): 获取和修改的是元素的属性,如img的src属性和alt属性,a链接的href属性等等。
css() :获取和修改的是样式里面的属性,即是style里面的属性。
---------------------
作者:chdyiboke
来源:CSDN
原文:https://blog.csdn.net/chdyiboke/article/details/82700001
版权声明:本文为博主原创文章,转载请附上博文链接!
jQuery根据style筛选元素的更多相关文章
- jquery筛选元素函数
jquery筛选元素函数 1.过滤匹配第二个p元素: $("button").click(function(){ $("p").eq(1).css(" ...
- jquery 筛选元素 (3)
.addBack() 添加堆栈中元素集合到当前集合中,一个选择性的过滤选择器. .addBack([selector]) selector 一个字符串,其中包括一个选择器表达式,匹配当前元素集合,不包 ...
- jquery 筛选元素(1)
.eq() 减少匹配元素的集合为指定的索引的那一个元素. .eq(index) index一个整数,指示元素的位置,以0为基数. $("li").eq(2).css('backgr ...
- jQuery children等筛选用法
jQuery children等筛选用法: <%@ page language="java" import="java.util.*" pageEncod ...
- jQuery初探 jQuery选取和操纵元素的特点
jQuery初探 jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当 ...
- [jQuery]无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案
在做茶城网改版工作的时候,又遇到一个新问题,我需要用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢 ...
- jQuery选取和操纵元素的特点
jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当id不存在的时候, ...
- 通过jquery隐藏和显示元素
通过jquery隐藏和显示元素 调用jquery本身提供的函数 $("xxx").hide();//隐藏xxx $("xxx").show();//显示xxx ...
- jQuery无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案
用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢工了. 用Chrome自带的开发工具一查,发现罢工 ...
随机推荐
- [唐胡璐]Selenium技巧 - 利用MonteScreenRecorder录制视频
我们可以用以下方式在Selenium Webdriver中capture video. 基本步骤: 从 http://www.randelshofer.ch/monte/,下载“MonteScreen ...
- 《Flask Web开发实战:入门、进阶与原理解析》 学习笔记
一个视图函数可以绑定多个 URL 为了让互联网上的人都可以访问,需要安装程序的服务器有公网ip 如果过度使用扩展,在不需要 的地方引人,那么相应也会导致代码不容易维护 ,应该尽量从实际需求出发,只在需 ...
- C++创建对象的3种方式(转载)
#include <iostream> using namespace std; class A { private: int n; public: A(int m):n(m) { } ~ ...
- python是什么编程语言。
python是一门动态解释性的强类型定义语言.
- Python 的内置字符串方法(收藏专用)
Python 的内置字符串方法(收藏专用) method 字符串 string python3.x python 4.7k 次阅读 · 读完需要 44 分钟 5 字符串处理是非常常用的技能,但 ...
- P5590 【赛车游戏】
果然我还是太\(Naive\)了 首先有一些点/边其实是没有意义的,如果从1出发不能到该点或者从该点不能到n,这个点就可以不用管了.这个过程可以用正反两边\(dfs/bfs\)实现 然后删掉那些点之后 ...
- 【概率论】5-7:Gama分布(The Gamma Distributions Part II)
title: [概率论]5-7:Gama分布(The Gamma Distributions Part II) categories: - Mathematic - Probability keywo ...
- Luogu4931 情侣?给我烧了!(加强版)【生成函数】
题目链接:洛谷 大家一起 日 ♂ % EI 设\(D_i\)表示\(k=0\)时的答案.那么 \[ f(n,k)=\binom{n}{k}^2D_{n-k}k!2^k \] 意义是选择\(k\)对情侣 ...
- http2 3
HTTP 2 推荐阅读:https://segmentfault.com/a/1190000011172823?utm_source=tag-newest 进来支持 HTTP 2 的网站越来愈多了,这 ...
- Iptables之一基本应用
Firewall :防火墙,隔离工具 工作于主机或网络的边缘,对于进出本主机或网络的报文根据事先定义好的检查规则作匹配检测,对于能够被规则所匹配到的报文做出相应处理的组件 主机防火墙 网络防火墙 ID ...