如何在jQuery中通过CSS样式进行选择？
[英]How to select by CSS styles in jQuery?
问题描述
I'm trying to find all the parent elements that have the CSS style display:none . 
我正在尝试查找具有CSS样式display:none所有父元素display:none 。 I can't seem to get it to work though. 我似乎无法让它工作。 Here's what I've got: 这是我得到的：
var $parents = $(...).parents("[css=display:none]");
4 个解决方案
解决方案1
15 已采纳 2010-09-03 22:48:53
If you want the ones that are actually display: none; 如果你想要实际 display: none;的那些display: none; (not just possibly contained in another display: none; ), you can use .filter() and .css() to get those parents, like this: （不仅可能包含在另一个display: none; ），您可以使用.filter()和.css()来获取这些父项，如下所示：
var $parents = $(...).parents().filter(function() {
return $(this).css('display') == 'none';
});
This gets the parents, then filters them to get only the ones that are display: none; 这会得到父母，然后过滤它们只得到display: none;的那些display: none; on that specific parent. 在那个特定的父母。
解决方案2
8 2010-09-03 23:21:09
@Nick's solution is a very simple and straightforward method of achieving your goal. @ Nick的解决方案是实现目标的一种非常简单直接的方法。 It's also probably the best performing method. 它也可能是表现最好的方法。 However, for the sake of completeness and convenience (if you're doing this a lot), it's also possible to create your own selector: 但是，为了完整性和便利性（如果你这么做很多），也可以创建自己的选择器：
$.expr[':'].css = function(obj, index, meta, stack) {
var args = meta[3].split(/\s*=\s*/);
return $(obj).css(args[0]) == args[1];
}
// Then we can use our custom selector, like so:
$("#myElement").parents(":css(display=none)").show();
Example - http://jsfiddle.net/V8CQr/ . 示例 - http://jsfiddle.net/V8CQr/ 。
See more information on creating custom selectors at: 有关创建自定义选择器的更多信息，请访问：
http://www.jameswiseman.com/blog/2010/04/19/creating-a-jquery-custom-selector/ http://www.jameswiseman.com/blog/2010/04/19/creating-a-jquery-custom-selector/
解决方案3
1 2012-04-30 13:28:21
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('a').parents('div[style*="display: none"], [style*="display:none"]').show();
});
</script>
</head>
<body>
<div class="Test" style="color: Red; display: none;">
aaa <a href="#test">test</a><br />
</div>
<div class="Test" style="color: Aqua;">
bbb <a href="#test">test</a><br />
</div>
<div class="Test" style="font-size: 15px; display: none;">
ccc <a href="#test">test</a><br />
</div>
</body>
</html>
解决方案4
1 2015-12-22 10:36:24
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.