用javascript实现登录注册界面跳转

先看看成品

我们要做的就是这么一个可以跳转的登录注册界面

javascript代码*

var TurnToLogin = () => {
	document.getElementById('form_login_div').style.display = "block";
	document.getElementById('form_register_div').style.display = "none";
}
var TurnToRegister = () => {
	document.getElementById('form_register_div').style.display = "block";
	document.getElementById('form_login_div').style.display = "none";
}

上面这几行代码即界面跳转的核心代码。
TurnToLogin与TurnToRegister函数实现了登录与注册页面的跳转。
通过获取界面的id并对该界面的display属性进行修改，跳转至注册界面时注册界面的display改为block（显示），登录界面的dispaly改为none（不显示）。跳转登录界面同理。

css代码

#form_login_div{
	display: block;
}
.
.
.
#form_register_div{
	display: none;
}
.
.
.

通过css对登录注册界面的样式进行排版，详细代码就不在这写了，下面有链接可以下载

html代码

	登陆账号


	

	

	

	   
	




	注册账号


	

	

	

	

	

	   
	

这里的html简单的实现了一个登陆注册界面，重点是div要有id使得javascript可以获取该div信息，然后对div的display属性进行修改

完整代码：
链接：https://pan.baidu.com/s/1BzPMweEJXFBveYt1g4M0xw
提取码：bfk7