Javascript 如果选择了第一个下拉菜单中的选项，则创建第二个下拉菜单

我对HTML/CSS/Javascript完全陌生，在此之前我向大家道歉，因为这里也有人问过类似的问题，但解决方案比我需要的要复杂得多，而且都涉及jquery。因为我希望我需要的是非常基本的，我希望有一个更简单，初学者友好的解决方案

我的目标：如果用户在下拉菜单Dropdown1中选择特定选项Option Country Reports，则第二个单独的下拉菜单（即非子菜单）Dropdown2将出现在预定位置，即绝对位置

我当前的HTML代码是：

<div id="location1">
     <select name="dropdown1">
          <option value="0">     </option>
          <option value="1">Country Reports</option>
          <option value="2">Current Production Costs</option>
          <option value="3">Most Recent Newsflash</option>
      </select> 
</div>
<div id="location2">
     <select name="dropdown2">
          <option value="0">     </option>
          <option value="1A">Country Report Portugal</option>
          <option value="1B">Country Report Spain</option>
          <option value="1C">Country Report Turkey</option>
      </select> 
 </div>

---

非常感谢您的帮助。

制作一个简单的JS函数：

 function func(){
    if (document.getElementById("dropdown1").value == "1") {    
        document.getElementById("location2").style.display = 'block';
    }
    else{
        document.getElementById("location2").style.display = 'none';
    }
 }

您需要在onchange事件上调用上述函数

---

你试过js吗？如果是，告诉我们…否则先试试

 function func(){
    if (document.getElementById("dropdown1").value == "1") {    
        document.getElementById("location2").style.display = 'block';
    }
    else{
        document.getElementById("location2").style.display = 'none';
    }
 }

<div id="location1">
 <select id="dropdown1" onchange="func()">
      <option value="0">     </option>
      <option value="1">Country Reports</option>
      <option value="2">Current Production Costs</option>
      <option value="3">Most Recent Newsflash</option>
  </select> 
</div>
<div id="location2">
 <select name="dropdown2">
      <option value="0">     </option>
      <option value="1A">Country Report Portugal</option>
      <option value="1B">Country Report Spain</option>
      <option value="1C">Country Report Turkey</option>
  </select> 
 </div>

#location1
{
position: absolute;
top: 20px;
left: 400px;
width: 250px;
height: 70px;
}
#location2
{
position: absolute;
top: 150px;
left: 400px;
width: 250px;
height: 70px;
display:none;
}