jquery条
以下是关于jQuery条件判断和筛选元素的几种常见方法,结合DOM操作和事件处理场景:
条件判断基础
使用if语句结合jQuery选择器或属性判断元素状态
if ($('#element').is(':visible')) {
// 元素可见时的操作
}
筛选元素方法
通过选择器或过滤函数筛选特定元素
$('li').filter(function() {
return $(this).text().indexOf('关键') >= 0;
}).css('color', 'red');
类名条件判断
检查元素是否包含特定类名
if ($('#btn').hasClass('active')) {
// 类存在时的处理
}
表单条件验证
常见表单元素值判断
$('input[type="checkbox"]').change(function() {
if ($(this).prop('checked')) {
// 复选框被选中
}
});
链式条件操作
结合jQuery链式调用进行多条件处理
$('.item')
.hide()
.filter('.important')
.show()
.end()
.filter(':odd')
.css('background', '#eee');
事件委托条件
事件委托时通过条件判断目标元素
$(document).on('click', '.btn', function(e) {
if ($(e.target).data('type') === 'confirm') {
// 特定数据属性的按钮
}
});
可见性条件
根据元素可见性执行不同操作

$('#toggle').click(function() {
var $box = $('#box');
$box.toggle();
if ($box.is(':hidden')) {
// 隐藏后的回调
}
});
以上方法可根据实际需求组合使用,注意jQuery 3.x版本中部分伪类选择器如:visible的性能优化。对于复杂条件,建议将判断逻辑封装为独立函数提高可维护性。






