<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筛选元素的更多相关文章

  1. jquery筛选元素函数

    jquery筛选元素函数 1.过滤匹配第二个p元素: $("button").click(function(){ $("p").eq(1).css(" ...

  2. jquery 筛选元素 (3)

    .addBack() 添加堆栈中元素集合到当前集合中,一个选择性的过滤选择器. .addBack([selector]) selector 一个字符串,其中包括一个选择器表达式,匹配当前元素集合,不包 ...

  3. jquery 筛选元素(1)

    .eq() 减少匹配元素的集合为指定的索引的那一个元素. .eq(index) index一个整数,指示元素的位置,以0为基数. $("li").eq(2).css('backgr ...

  4. jQuery children等筛选用法

    jQuery children等筛选用法: <%@ page language="java" import="java.util.*" pageEncod ...

  5. jQuery初探 jQuery选取和操纵元素的特点

    jQuery初探 jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当 ...

  6. [jQuery]无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案

    在做茶城网改版工作的时候,又遇到一个新问题,我需要用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢 ...

  7. jQuery选取和操纵元素的特点

    jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当id不存在的时候, ...

  8. 通过jquery隐藏和显示元素

    通过jquery隐藏和显示元素 调用jquery本身提供的函数 $("xxx").hide();//隐藏xxx $("xxx").show();//显示xxx ...

  9. jQuery无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案

    用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢工了. 用Chrome自带的开发工具一查,发现罢工 ...

随机推荐

  1. Linux LVM--三种Logic Volume

    本文链接:https://blog.csdn.net/u012299594/article/details/84551722 概述 为了满足在性能和冗余等方面的需求,LVM支持了下面三种Logic V ...

  2. linux 登录后有时候会出现-bash-4.1$

    转载自https://blog.csdn.net/jiedao_liyk/article/details/78470498 linux登录后有时候会出现-bash-4.1$ 造成这样的原因: 与这个用 ...

  3. HDP 企业级大数据平台

    一 前言 阅读本文前需要掌握的知识: Linux基本原理和命令 Hadoop生态系统(包括HDFS,Spark的原理和安装命令) 由于Hadoop生态系统组件众多,导致大数据平台多节点的部署,监控极其 ...

  4. (尚004)Vue计算属性之基本使用和监视

    所做效果预览: test004.html <!DOCTYPE html><html lang="en"><head> <meta char ...

  5. KMP 最小循环节

    博客  

  6. lixuxmint系统定制与配置(2)-输入法

    小书匠Linux RIME的官网在这里 1.安装 刚开始是使用ibus-rime,后来使用过程感觉不舒服,就换回fcitx-rime.使用以下命令安装fcitx-rime sudo apt insta ...

  7. (5)Go数组

    数组 数组是同一种数据类型元素的集合. 在Go语言中,数组从声明时就确定,使用时可以修改数组成员,但是数组大小不可变化. 基本语法: // 定义一个长度为3元素类型为int的数组a var a [3] ...

  8. 解释下Http协议

    HTTP是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统. HTTP协议的主要特点可概括如下: 1.支持客户/服务器模式. 2.简单快速:客户向服务器请求服务时,只 ...

  9. mysql小白入门

    mysql简介 1.什么是数据库 ? 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库,它产生于距今六十多年前,随着信息技术和市场的发展,特别是二十世纪九十年代以后,数据管理不再仅 ...

  10. springMvc---WebMvcConfigurationSupport

    该类提供了主要的 MVC 配置方法,通过直接继承 WebMvcConfiguration ,并在继承类上 加上 @EnableWebMvc 和 @Configuration 注解之后.便可以在子类中实 ...