如何高效获取表格选中行的邮箱地址？优先原生JS方案

原生JS实现方案 #

直接使用浏览器原生API就能高效完成需求，无需依赖jQuery，代码更轻量、性能更好：

function tableToEmail() {
  // 获取所有被选中的复选框
  const checkedBoxes = document.querySelectorAll('input.selector:checked');
  // 转换为数组并提取对应行的邮箱文本
  const recipients = Array.from(checkedBoxes).map(checkbox => {
    return checkbox.closest('tr').querySelector('.email').textContent.trim();
  });
  // 输出逗号分隔的字符串
  console.log(recipients.join(','));
}

优化说明 #

• 抛弃jQuery依赖：原生API避免了库封装带来的性能开销，同时减少项目体积
• 更简洁的数组处理：用Array.from()配合map()替代手动循环+push()，代码更符合现代JS风格
• 鲁棒性提升：添加trim()清除邮箱文本前后可能存在的空白字符
• 原生API更直接：closest()和querySelector()都是浏览器原生支持的DOM方法，执行效率高

jQuery版本优化（如果仍需保留jQuery） #

如果项目已经依赖jQuery，也可以简化原代码：

function tableToEmail() {
  const recipients = $('input.selector:checked')
    .map(function() {
      return $(this).closest('tr').find('.email').text().trim();
    })
    .get(); // 将jQuery对象转换为原生数组
  console.log(recipients.join(','));
}

优化点：用jQuery的map()方法替代each()+push()的组合，代码更紧凑，最后通过get()将jQuery集合转为原生数组再执行join()。

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