通过邮箱后缀筛选邮箱
<table>
<tr>
<td>邮箱数据A列</td>
<td>邮箱数据B列</td>
<td>邮箱数据C列</td>
</tr>
<tr>
<td><textarea name="textarea2" id="textarea2" style="width:260px; height:300px;" >
111@aaa.com
222@bbb.com
333@ccc.com
444@aaa.com
555@ddd.com
333@ccc.com
666@eee.com
</textarea>
</td>
<td>
<textarea name="textarea2" id="textarea2" style="width:260px; height:300px;" >
@aaa.com
@bbb.com
@ccc.com
@zzz.com
</textarea>
</td>
<td>
<textarea name="textarea3" id="textarea3" style="width:260px; height:300px;" >
555@ddd.com
666@eee.com
</textarea>
</td>
</tr>
<tr>
<td colspan="3">
邮箱数据A列为输入的很多列邮箱数据 textarea</br>
邮箱数据B列为输入的很多列邮箱后缀 textarea</br>
邮箱数据C列为从数据A中减去所有包含数据B邮箱后缀的邮箱 textarea；输入A和B后自动得出C</br>
</td>
</tr>
</table>
邮箱数据C列为从数据A中减去所有包含数据B邮箱后缀的邮箱 textarea；输入A和B后自动得出C
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table>
<tr>
<td>邮箱数据A列</td>
<td>邮箱数据B列</td>
<td>邮箱数据C列</td>
</tr>
<tr>
<td><textarea name="textarea2" id="textarea1" oninput="handler" style="width:260px; height:300px;" >
111@aaa.com
222@bbb.com
333@ccc.com
444@aaa.com
555@ddd.com
333@ccc.com
666@eee.com
</textarea>
</td>
<td>
<textarea name="textarea2" id="textarea2" oninput="handler" style="width:260px; height:300px;" >
@aaa.com
@bbb.com
@ccc.com
@zzz.com
</textarea>
</td>
<td>
<textarea name="textarea3" id="textarea3" style="width:260px; height:300px;" >
</textarea>
</td>
</tr>
<tr>
<td colspan="3">
邮箱数据A列为输入的很多列邮箱数据 textarea</br>
邮箱数据B列为输入的很多列邮箱后缀 textarea</br>
邮箱数据C列为从数据A中减去所有包含数据B邮箱后缀的邮箱 textarea；输入A和B后自动得出C</br>
</td>
</tr>
</table>
<script>
function handler(){
var list_a = document.querySelector('#textarea1').value.split('\n').map(item=>item.trim())
var list_b = document.querySelector('#textarea2').value.split('\n').map(item=>item.trim())
var value_c = []
value_c = list_a.filter(i=>{
let flag = true;
list_b.map(item=>{
// console.info(i.indexOf(item)>-1)
if(item && i.indexOf(item)>-1){
console.info(i,i.indexOf(item),item,'??')
flag = false;
}
})
return flag
}).join('\n')
document.querySelector('#textarea3').value = value_c
}
const a = document.querySelector('#textarea1');
const b =document.querySelector('#textarea2')
a.addEventListener('input',handler)
b.addEventListener('input',handler)
handler()
</script>
</body>
</html>
感觉没有邮箱的事，就是A数组中去除含有B数组的，剩下的给C数组.首先定义一个函数用于获取C
/**
* 在A数组中删除B数组存在的项,并且返回新的数组；函数不支持对象数组
* @param {Array} firList 目标数组
* @param {*} secList 需要删除数组项
* @param {String} attrName 不传默认为字符串数组，传则是对象数组，指定比较的属性名对应值
* @returns 不含有secList中项的数组firList
*/
function Filter_AList_Without_BList (firList, secList, attrName = '') {
if (firList.constructor !== Array) return []
if (secList.constructor !== Array) return firList
secList.forEach((i, i_index) => {
firList.forEach((j, j_index) => {
if (!attrName) {
// 不指定属性名，表示当前比较双方是字符串数组，i/j直接表示值，进行比较
if (i === j) {
firList.splice(j_index, 1)
}
} else {
// 指定属性名，表示当前比较双方的对象数据
if (i[attrName] && j[attrName] && i[attrName] === j[attrName]) {
firList.splice(j_index, 1)
}
}
})
})
return firList
}
然后调用的话就是，每次输入的值的时候就去触发这里的逻辑去计算C
var a = ['a', 'b', 'c']
var b = ['a']
var c = Filter_AList_Without_BList(a, b)
console.log(c)
一定要用原生去写吗？推荐lodash插件处理数据，这里可以用difference().
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table>
<tr>
<td>邮箱数据A列</td>
<td>邮箱数据B列</td>
<td>邮箱数据C列</td>
</tr>
<tr>
<td><textarea name="textarea2" id="textarea1" style="width:260px; height:300px;" >
111@aaa.com
222@bbb.com
333@ccc.com
444@aaa.com
555@ddd.com
333@ccc.com
666@eee.com
</textarea>
</td>
<td>
<textarea name="textarea2" id="textarea2" style="width:260px; height:300px;" >
@aaa.com
@bbb.com
@ccc.com
@zzz.com
</textarea>
</td>
<td>
<textarea name="textarea3" id="textarea3" style="width:260px; height:300px;" >
</textarea>
</td>
</tr>
<tr>
<td colspan="3">
邮箱数据A列为输入的很多列邮箱数据 textarea</br>
邮箱数据B列为输入的很多列邮箱后缀 textarea</br>
邮箱数据C列为从数据A中减去所有包含数据B邮箱后缀的邮箱 textarea；输入A和B后自动得出C</br>
</td>
</tr>
</table>
<script>
function handler(){
var list_a = document.querySelector('#textarea1').value.split('\n').map(item=>item.trim());
var list_b = document.querySelector('#textarea2').value.split('\n').map(item=>item.trim());
var value_c = [];
value_c = list_a.filter(email=>list_b.filter(suffix=>email.includes(suffix)).filter(i=>i).length <= 0).join('\n');
document.querySelector('#textarea3').value = value_c;
}
const a = document.querySelector('#textarea1');
const b = document.querySelector('#textarea2');
a.addEventListener('input',handler);
b.addEventListener('input',handler);
handler()
</script>
</body>
</html>