通过多类选择器及:last-of-type/.last()移除指定类的问题

你的代码失效的核心问题是错误地将jQuery对象和字符串拼接，导致生成了无效的选择器。另外还要确保代码在DOM完全加载后执行，否则可能找不到目标元素。

正确的代码实现 #

// 确保DOM加载完成后执行
$(document).ready(function() {
  // 获取最后一个.form-group元素（jQuery对象）
  const lastFormGroup = $('.form-group').last();
  // 在这个元素内部找到带有col-sm-offset-4类的div，移除该类
  lastFormGroup.find('div.col-sm-offset-4').removeClass('col-sm-offset-4');
  
  // 或者如果目标div是.form-group的直接子元素，用children()更高效：
  // lastFormGroup.children('div.col-sm-offset-4').removeClass('col-sm-offset-4');
});

为什么你的原代码不生效？ #

• 你写的$(lastForm+' div.col-sm-12')中，lastForm是一个jQuery对象，当它和字符串拼接时，会被转换成[object Object] div.col-sm-12，这显然不是有效的CSS选择器，jQuery无法找到对应的元素。
• 之前尝试的$('.form-group div.col-sm-12').removeClass('col-sm-offset-4')无效，大概率是因为代码在DOM还没完全渲染时就执行了，此时.form-group元素还不存在，自然无法操作它的子元素。

额外验证 #

如果你的需求是移除所有.form-group下的col-sm-offset-4类，只需要调整选择器：

$(document).ready(function() {
  $('.form-group div.col-sm-offset-4').removeClass('col-sm-offset-4');
});

但根据你的描述，你只需要操作最后一个.form-group，所以第一种方案更精准。

内容的提问来源于stack exchange，提问作者Lachie