Javascript 如何使单选按钮切换值

我正在尝试根据我的选择将数据值切换到动物或植物，我希望将动物数组作为默认值。我的代码不起作用了，有没有一种方法可以安全地做到这一点而不会在全局空间中造成太多的崩溃

let animal=[‘猫’、‘狗’、‘狮子’]；
让植物=[‘橙色’、‘芒果’、‘香蕉’]；
//-----//反抗----
数据=动物；
让工具提示msg='Animal distribution'；
//-----//反抗----
让anima=document.querySelector（'#animalBtn'）；
let plan=document.querySelector（“#plantBtn”）；
功能（动物）{
如果（数据！==动物）{
window.data=动物；
window.toolTipMsg='Animal distribution'；
}
}
函数fnPlant（）{
如果（数据！==工厂）{
window.data=工厂；
window.toolTipMsg='Plant distribution'；
}
}
anima.addEventListener（'click'，fnAnimal，false）；
plan.addEventListener（'click'，fnPlant，false）；
document.getElementById（'show'）.innerHTML=data.toString（）

动物
种植

在不做太多更改的情况下，下面的代码通过添加
文档.getElementById（'show'）.innerHTML=data.toString（）来更改
#show
中的值在每个事件处理程序中


let animal=[‘猫’、‘狗’、‘狮子’]；
让植物=[‘橙色’、‘芒果’、‘香蕉’]；
//-----//反抗----
数据=动物；
让工具提示msg='Animal distribution'；
//-----//反抗----
让anima=document.querySelector（'#animalBtn'）；
let plan=document.querySelector（“#plantBtn”）；
功能（动物）{
如果（数据！==动物）{
window.data=动物；
window.toolTipMsg='Animal distribution'；
}
document.getElementById（'show'）.innerHTML=data.toString（）；
}
函数fnPlant（）{
如果（数据！==工厂）{
window.data=工厂；
window.toolTipMsg='Plant distribution'；
}
document.getElementById（'show'）.innerHTML=data.toString（）；
}
anima.addEventListener（'click'，fnAnimal，false）；
plan.addEventListener（'click'，fnPlant，false）

动物
种植

在不做太多更改的情况下，下面的代码通过添加
文档.getElementById（'show'）.innerHTML=data.toString（）来更改
#show
中的值在每个事件处理程序中


let animal=[‘猫’、‘狗’、‘狮子’]；
让植物=[‘橙色’、‘芒果’、‘香蕉’]；
//-----//反抗----
数据=动物；
让工具提示msg='Animal distribution'；
//-----//反抗----
让anima=document.querySelector（'#animalBtn'）；
let plan=document.querySelector（“#plantBtn”）；
功能（动物）{
如果（数据！==动物）{
window.data=动物；
window.toolTipMsg='Animal distribution'；
}
document.getElementById（'show'）.innerHTML=data.toString（）；
}
函数fnPlant（）{
如果（数据！==工厂）{
window.data=工厂；
window.toolTipMsg='Plant distribution'；
}
document.getElementById（'show'）.innerHTML=data.toString（）；
}
anima.addEventListener（'click'，fnAnimal，false）；
plan.addEventListener（'click'，fnPlant，false）

动物
种植

将数据放入使用源作为键的对象中。然后，您可以轻松地添加更多源代码，而无需为每个源代码编写新代码

您需要更新单击处理程序中的内部HTML


let源={
动物：{list:['cat'、'dog'、'lion']，工具提示：“动物分布”}，
植物：{列表：['橙色'，'芒果'，'香蕉']，工具提示：'植物分布'}
};
让anima=document.querySelector（'#animalBtn'）；
let plan=document.querySelector（“#plantBtn”）；
函数selectSource（源）{
sources.current=源[源]；
window.toolTipMsg=sources.current.tooltip；
document.getElementById（'show'）.innerHTML=sources.current.list.toString（）；
}
anima.addEventListener（'click'，函数（e）{selectSource（e.currentTarget.dataset.source）；}，false）；
plan.addEventListener（'click'，函数（e）{selectSource（e.currentTarget.dataset.source）；}，false）；
选择来源（“动物”）

动物
种植

将数据放入使用源作为键的对象中。然后，您可以轻松地添加更多源代码，而无需为每个源代码编写新代码

您需要更新单击处理程序中的内部HTML


let源={
动物：{list:['cat'、'dog'、'lion']，工具提示：“动物分布”}，
植物：{列表：['橙色'，'芒果'，'香蕉']，工具提示：'植物分布'}
};
让anima=document.querySelector（'#animalBtn'）；
let plan=document.querySelector（“#plantBtn”）；
函数selectSource（源）{
sources.current=源[源]；
window.toolTipMsg=sources.current.tooltip；
document.getElementById（'show'）.innerHTML=sources.current.list.toString（）；
}
anima.addEventListener（'click'，函数（e）{selectSource（e.currentTarget.dataset.source）；}，false）；
plan.addEventListener（'click'，函数（e）{selectSource（e.currentTarget.dataset.source）；}，false）；
选择来源（“动物”）

动物
种植