使用纯javascript显示加载器

// 创建加载器
function createLoader() {
  // 创建一个包含加载器的div元素
  const loader = document.createElement('div');
  loader.classList.add('loader');

  // 创建加载器的子元素，比如一个旋转的图标或进度条
  const icon = document.createElement('div');
  icon.classList.add('icon');
  loader.appendChild(icon);

  // 将加载器添加到页面中
  document.body.appendChild(loader);
}

// 显示加载器
function showLoader() {
  const loader = document.querySelector('.loader');
  if (loader) {
    loader.style.display = 'block';
  } else {
    createLoader();
  }
}

// 隐藏加载器
function hideLoader() {
  const loader = document.querySelector('.loader');
  if (loader) {
    loader.style.display = 'none';
  }
}

// 使用示例
showLoader();

// 模拟一个耗时操作
setTimeout(() => {
  hideLoader();
}, 3000);