javascript - 将其他 dom 元素操作包含到另一个 dom 元素操作中是一种很好的做法，就像 javascript 中的通用操作一样

Question

下面是好的实践代码吗？(jquery)

common.js(在同一个js Action 中编写的两个文件的dom元素)

$('.list_item').click(function () {
   $('#yes_button').addClass('selected');
   $('#no_button').addClass('selected_no');
});

yes_button.html

<div class='list_item yes_class' > Muhammad s.a.w </div>
<div id='yes_button' > Yes </div>

no_button.html

<div class='list_item no_class'> Muhammad s.a.w </div>
<div id='no_button' > No </div>

上面的做法好还是应该像下面这样写

$('.yes_class').click(function () {
   $('#yes_button').addClass('selected');
});

$('.no_class').click(function () {
   $('#no_button').addClass('selected_no');
});

我有两个 DOM 元素类相同的文件，我正在编写基于唯一性的 JS 代码 类名，我的问题是遵循这种方式是好的做法。

Answer 1

为什么不为您的按钮添加一个通用类并通过它调用它们？

$('.list_item').click(function () {
   $('.button').addClass('selected');
});

如果你愿意，你可以像这样更具体地说明你定位的是哪个按钮

$('.list_item').click(function () {
   $(this).next('button').addClass('selected');
});

假设您保持相同的 html 结构

<div class="listitem"></div>
<div class="button" id="..."></div>