jquery 加减

jQuery 实现加减操作的方法

基础加减运算

jQuery本身不提供专门的加减函数，但可以结合JavaScript原生语法实现。数值加减可通过parseInt()或parseFloat()转换后计算：

var num1 = parseInt($('#input1').val());
var num2 = parseInt($('#input2').val());
var result = num1 + num2;  // 加法
$('#result').text(result);

DOM元素数量增减

通过jQuery选择器获取元素数量后进行操作：

var itemCount = $('.list-item').length;
$('#count').text(itemCount - 1);  // 减少数量显示

样式类增减

使用addClass()和removeClass()动态修改元素样式：

$('#target').addClass('active');  // 增加类
$('#target').removeClass('hidden');  // 移除类

动画高度增减

通过animate()实现可视化的高度变化效果：

$('#box').animate({ height: '+=50px' });  // 高度增加
$('#box').animate({ height: '-=30px' });  // 高度减少

表单数值增减

典型购物车数量调整场景的实现代码：

$('.plus-btn').click(function() {
  var $input = $(this).siblings('.quantity');
  $input.val(parseInt($input.val()) + 1);
});

$('.minus-btn').click(function() {
  var $input = $(this).siblings('.quantity');
  if ($input.val() > 0) {
    $input.val(parseInt($input.val()) - 1);
  }
});

注意事项

• 处理数值时建议先使用parseInt()或parseFloat()进行类型转换
• 对可能为空的表单字段增加val() || 0的默认值处理
• 动画操作需考虑性能影响，可配合stop()方法使用