可能需要用到的方法
/*
dom的增删改
appendTo（） a.appendTo（b） 把a插入到b元素末尾，成为最后一个子元素
prependTo(content) a.prependTo(b) 把a插入到b所有子元素前面，成为第一个子元素
外部插入
insertAfter(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的后面。
insertBefore(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
替换
replaceWith(content|fn) 将所有匹配的元素替换成指定的HTML或DOM元素。（一个）
replaceAll(selector) 用匹配的元素替换掉所有 selector匹配到的元素。
删除
empty() 删除匹配的元素集合中所有的子节点。 a.empty() 清空a标签里的内容
remove([expr]) 从DOM中删除所有匹配的元素。 a.remove()删除a标签
*/
appendTo（）会自动删除移动前的元素
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title><style type="text/css">select {width: 100px;height: 140px;}div {width: 130px;float: left;text-align: center;}</style><script type="text/javascript" src="../js/jquery.js"></script><script type="text/javascript">/*dom的增删改appendTo（） a.appendTo（b） 把a插入到b元素末尾，成为最后一个子元素prependTo(content) a.prependTo(b) 把a插入到b所有子元素前面，成为第一个子元素外部插入insertAfter(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的后面。insertBefore(content) 把所有匹配的元素插入到另一个、指定的元素元素集合的前面。替换replaceWith(content|fn) 将所有匹配的元素替换成指定的HTML或DOM元素。（一个）replaceAll(selector) 用匹配的元素替换掉所有 selector匹配到的元素。删除empty() 删除匹配的元素集合中所有的子节点。 a.empty() 清空a标签里的内容remove([expr]) 从DOM中删除所有匹配的元素。 a.remove()删除a标签*/$(function(){//选中添加到右边$("#btn1").click(function () {//获取选中项let $select = $("select[name='sel01']>option:selected");//移动到右边$select.appendTo($("select[name='sel02']"));$select.prop("selected","true");})//全部添加到右边$("#btn2").click(function () {//获取项let $select = $("select[name='sel01']>option");//移动到右边$select.appendTo($("select[name='sel02']"));})//选中删除到左边$("#btn3").click(function () {//获取选中项let $select = $("select[name='sel02']>option:selected");//移动到左边$select.appendTo($("select[name='sel01']"));//选中$select.prop("selected","true");})//全部删除到左边$("#btn4").click(function () {//获取项let $select = $("select[name='sel02']>option");//移动到左边$select.appendTo($("select[name='sel01']"));})});</script>
</head>
<body><div id="left"><select multiple="multiple" name="sel01"><option value="opt01">选项1</option><option value="opt02">选项2</option><option value="opt03">选项3</option><option value="opt04">选项4</option><option value="opt05">选项5</option><option value="opt06">选项6</option><option value="opt07">选项7</option><option value="opt08">选项8</option></select><button id="btn1">选中添加到右边</button><button id="btn2">全部添加到右边</button></div><div id="rigth"><select multiple="multiple" name="sel02"></select><button id="btn3">选中删除到左边</button><button id="btn4">全部删除到左边</button></div></body>
</html>