<button class="btn1">month1</button>
<button class="btn1">month2</button>
<button class="btn1">month3</button>
若要给上面3个都具有btn1的class的按钮,添加同样的点击事件,则如下操作:
$(".btn1").each(function () {
$(this).click(function () {
alert($(this).html());
});
});
若接下来要给上面3个都具有btn1的class的按钮,添加相同的css样式,则如下操作:
$(".btn1").each(function () {
$(this).css({
"height": "20px",
"width": "100px"
});
});
<button class="btn1 btn2">month4</button>
<button class="btn1 btn2">month5</button>
<button class="btn1 btn2">month6</button>
ps:如果目标元素是像上面这样,具有多个class,则如下操作:
$(".btn1.btn2").each(function () {
my_function();
});
或者:
$("[class='btn1 btn2']").each(function () {
my_function();
});
批量操作DOM元素与事件绑定
本文详细介绍了如何使用jQuery批量操作具有相同类名的DOM元素,包括为这些元素添加点击事件和设置统一的CSS样式。同时,针对具有多个类名的元素提供了选择和操作的方法。





