实在是找不到很好的解决方法了，于是利用列表和js来模拟select了。

代码如下，如果有更好的方法请告诉我一声，谢谢。

Document

body {

display: flex;

flex-direction: column;

}

li {

list-style: none;

cursor: pointer;

border: 1px solid red;

display: none;

}

li:first-child {

display: block;

}

let select = document.getElementById('select');

select.addEventListener('click',(e)=>{

if(e.target.tagName == 'LI'){

let parentNode = e.target.parentNode;

let broderNodes = e.target.parentNode.childNodes;

let childrenNodes = e.target.parentNode.parentNode.childNodes;

let list = [];

for(let i in childrenNodes){

if([].indexOf.call(childrenNodes,childrenNodes[i])%2 == 1){

list.push(childrenNodes[i])

}

}

if([].indexOf.call(broderNodes,e.target) == 1){

if(broderNodes[3].style.display == 'block'){

for (let i in list){

if(e.target.parentNode != list[i]){

list[i].style.display = 'block';

}else{

let nodes = list[i].childNodes;

for(let j in nodes){

if([].indexOf.call(nodes,nodes[j]) == 1){

nodes[j].innerHTML = e.target.innerHTML;

}else if([].indexOf.call(nodes,nodes[j])%2 == 1){

nodes[j].style.display = 'none';

}

}

}

}

}else{

for (let i in list){

if(e.target.parentNode != list[i]){

list[i].style.display = 'none';

}else{

let nodes = list[i].childNodes;

for(let j in nodes){

if([].indexOf.call(nodes,nodes[j])%2 == 1){

nodes[j].style.display = 'block';

}

}

}

}

}

}else{

for (let i in list){

if(e.target.parentNode != list[i]){

list[i].style.display = 'block';

}else{

let nodes = list[i].childNodes;

for(let j in nodes){

if([].indexOf.call(nodes,nodes[j]) == 1){

nodes[j].innerHTML = e.target.innerHTML;

}else if([].indexOf.call(nodes,nodes[j])%2 == 1){

nodes[j].style.display = 'none';

}

}

}

}

}

}

})