显示两个相邻的div，然后在包含两个不同SCSS文件的其他div下显示一个div

<div class="container">
  <div class="div1"></div>
  <div class="div2"></div>
</div>
<div class="other-div">
  <div class="additional-div"></div>
</div>

.container {
  display: flex;
}

.div1 {
  width: 50%;
  background-color: #ccc;
}

.div2 {
  width: 50%;
  background-color: #ddd;
}

.other-div {
  margin-top: 20px;
}

.additional-div {
  width: 100%;
  height: 100px;
  background-color: #eee;
}

@import 'file1.scss';
@import 'file2.scss';

// 获取需要操作的div元素
const div1 = document.querySelector('.div1');
const div2 = document.querySelector('.div2');
const additionalDiv = document.querySelector('.additional-div');

// 显示和隐藏div的函数
function showDiv() {
  div1.style.display = 'block';
  div2.style.display = 'block';
  additionalDiv.style.display = 'block';
}

function hideDiv() {
  div1.style.display = 'none';
  div2.style.display = 'none';
  additionalDiv.style.display = 'none';
}

// 调用函数来显示div
showDiv();