jQuery 获取没有 display=”none” 的元素

在本文中，我们将介绍如何使用 jQuery 获取没有 display="none" 属性的元素。

在网页开发中，经常会遇到需要获取显示在页面上的元素的需求，而忽略那些被隐藏或不可见的元素。通过使用 jQuery，我们可以很方便地找到那些没有 display="none" 属性的元素。

使用 :visible 选择器

jQuery 提供了 :visible 选择器，可以用来选择当前可见的元素。通过使用这个选择器，我们可以轻松地找到没有 display="none" 属性的元素。下面是一个简单的示例：

// 选取所有没有 display="none" 的 div 元素
('div:not([style*="display:none"])').each(function() {
  console.log((this).text());
});

上面的代码中，我们使用了 :not() 选择器来排除那些包含 display="none" 属性的元素。在这个选择器的参数中，通过使用 [style*="display:none"]，我们可以选取所有包含 display="none" 的元素，然后用 :not() 进行排除。

使用 .not() 方法

除了使用 :visible 选择器外，我们还可以使用 jQuery 的 .not() 方法来筛选元素。这个方法允许我们使用自定义的函数来过滤出需要的元素。下面是一个示例：

// 选取所有没有 display="none" 的 div 元素
('div').not(function() {
  return(this).css('display') === 'none';
}).each(function() {
  console.log($(this).text());
});

上面的代码中，我们通过传入一个函数作为 .not() 方法的参数，来判断每个 div 元素的 display 属性是否为 none。如果是 none，则过滤掉这个元素，否则就保留下来。

使用 .filter() 方法

除了使用 .not() 方法外，我们还可以使用 jQuery 的 .filter() 方法来筛选元素。这个方法允许我们使用自定义的函数来过滤出需要的元素。下面是一个示例：

// 选取所有没有 display="none" 的 div 元素
('div').filter(function() {
  return(this).css('display') !== 'none';
}).each(function() {
  console.log($(this).text());
});