点击「没有账户？」切换显示.registrybox的JS脚本故障求助

嘿，我来帮你排查下脚本失效的原因，再给你修正后的方案：

首先，你的脚本存在几个关键问题导致无法正常运行：

• 错误1：类名多了.前缀
  getElementsByClassName()方法的参数是纯类名，不需要加.（这个方法本身就是按类名查找元素的），你写.registrybox是找不到目标元素的，得改成registrybox。

• 错误2：未处理集合类型的返回值
  getElementsByClassName()返回的是HTMLCollection（元素集合），哪怕页面只有一个对应类名的元素，它也是集合形式。直接给集合加.style是无效的，必须通过索引（比如[0]）取到具体元素。

• 缺失隐藏登录框的完整代码
  你的脚本里document.getElementsByClassName('.logi...没写完，需要补充完整逻辑，把loginbox的display设为none。

修正后的完整代码 #

我还给你补上了点击事件的绑定（假设「没有账户？」的元素id是toRegistry，你可以根据实际页面调整）：

// 定义切换显示的函数
function displayRegistry() {
  // 获取注册框并设置显示
  const registryBox = document.getElementsByClassName('registrybox')[0];
  if (registryBox) {
    registryBox.style.display = "block";
  }
  // 获取登录框并设置隐藏
  const loginBox = document.getElementsByClassName('loginbox')[0];
  if (loginBox) {
    loginBox.style.display = "none";
  }
}

// 给「没有账户？」绑定点击事件
const toRegistryBtn = document.getElementById('toRegistry');
if (toRegistryBtn) {
  toRegistryBtn.addEventListener('click', displayRegistry);
}

更简洁的写法（用querySelector） #

如果你习惯用CSS选择器语法，querySelector会更直观，它支持带.的类选择器，且直接返回单个元素：

function displayRegistry() {
  document.querySelector('.registrybox').style.display = "block";
  document.querySelector('.loginbox').style.display = "none";
}

document.getElementById('toRegistry').addEventListener('click', displayRegistry);

⚠️ 小提醒：要确保JS代码在DOM加载完成后执行，不然可能找不到元素。可以把代码放在DOMContentLoaded事件里，或者直接放在页面底部（</body>标签之前）。

内容的提问来源于stack exchange，提问作者Alexander