iframe滚动条怎么隐藏

这个滚动条有没有啥办法隐藏掉，滚动条隐藏了但要内容可以滚动的那种，用的iframe标签

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .container {
      width: 500px;
      height: 500px;
      overflow: hidden;
    }
    
    iframe {
      border: none;
    }
  </style>
</head>
<body>
  <div class="container">
    <iframe id="iframe" src="https://www.csdn.net/"></iframe>
  </div>
<script>
  // 获取滚动条宽度
  function getScrollbarWidth() {
    const outer = document.createElement('div');
    outer.style.visibility = 'hidden';
    outer.style.overflow = 'scroll';
    outer.style.msOverflowStyle = 'scrollbar';
    document.body.appendChild(outer);
    
    const inner = document.createElement('div');
    outer.appendChild(inner);
    
    const scrollbarWidth = (outer.offsetWidth - inner.offsetWidth);
    
    outer.parentNode.removeChild(outer);
    
    return scrollbarWidth;
  }
  const scrollWidth = getScrollbarWidth()
  
  const iframe = document.querySelector('#iframe')
  // 使iframe宽高多加一个滚动条的宽度
  iframe.style.width = `calc(100% + ${scrollWidth}px)`
  iframe.style.height = `calc(100% + ${scrollWidth}px)`
</script>
</body>
</html>

css 设置iframe滚动条样式宽度/高度为0