JavaScript分拆问题如图

AlexFung

1. //等待页面加载完后，执行如下代码
   
2. window.onload=function () {
   
3.     //console.log(1);//扩展console输出的函数有哪些？
   
4. 
   
5.     //捕捉登录按钮的单击事件
   
6.     //当被单击时
   
7.     document.getElementById("btnSubmit").onclick=function(){
   
8.         //console.log(1);
   
9. 
   
10.         //获取用户输入的两个input值
    
11.         var tipsEl=document.getElementById("tips");
    
12. 
    
13.         var userNameEl=document.getElementById("userName");
    
14.         var userNameVal=userNameEl.value;
    
15.         //判断是否符合验证逻辑
    
16.             //如果否，在按钮旁边 显示 红色的错误提示
    
17.         if(userNameVal==""){
    
18.             tipsEl.innerHTML="用户名必填！";
    
19.             userNameEl.style.borderColor="red";
    
20.             userNameEl.focus();
    
21.             return;
    
22.         }
    
23.         tipsEl.innerHTML="";
    
24.         userNameEl.style.borderColor='#90A9B7';
    
25. 
    
26.         var passWordEl=document.getElementById("passWord");
    
27.         var passWordVal=passWordEl.value;
    
28.         if(passWordVal==""){
    
29.             tipsEl.innerHTML="密码必填！";
    
30.             passWordEl.style.borderColor="red";
    
31.             passWordEl.focus();
    
32.             return;
    
33.         }
    
34.         tipsEl.innerHTML="";
    
35.         passWordEl.style.borderColor='#90A9B7';
    
36. 
    
37. 
    
38.         //如果都符合，提交表单
    
39.         document.getElementById("loginForm").submit();
    
40.     };
    
41. 
    
42. };
    

复制代码

1. //等待页面加载完后，执行如下代码
   
2. ready(function () {
   
3. 
   
4.     //捕捉登录按钮的单击事件
   
5.     //当被单击时
   
6.     click("btnSubmit",function(){
   
7.         //获取用户输入的两个input值
   
8.         //判断是否符合验证逻辑
   
9.             //如果否，在按钮旁边 显示 红色的错误提示
   
10.         if(val("userName")==""){
    
11.             html("tips","用户名必填！");
    
12.             css("userName","borderColor","red");
    
13.             focus("userName");
    
14.             return;
    
15.         }
    
16.         html("tips","");
    
17.         css("userName","borderColor","#90A9B7");
    
18. 
    
19.         if(val("passWord")==""){
    
20.             html("tips","密码必填！");
    
21.             css("passWord","borderColor","red");
    
22.             focus("passWord");
    
23.             return;
    
24.         }        
    
25.         html("tips","");
    
26.         css("passWord","borderColor","#90A9B7");
    
27. 
    
28. 
    
29.         //如果都符合，提交表单
    
30.         $("loginForm").submit();
    
31.     });
    
32. 
    
33. });

复制代码

1. //按传入标签的ID获取对应标签的对象
   
2. function $(id){
   
3.    
   
4. }
   
5. //按传入标签的ID获取对应标签的Value值
   
6. //如果传入第二个参数，就理解为不是获取value，而是改变value
   
7. function val(id,content){
   
8.    
   
9. }
   
10. //按传入标签的ID以及HTML内容去改变对应标签的innerHTML
    
11. //如果没有传入第二个参数，就理解为获取innerHTML
    
12. function html(id,content){  
    
13.    
    
14. }
    
15. 
    
16. 
    
17. //按传入标签的ID以及样式名称、样式值去改变对应标签、对应样式的值
    
18. //如果没有传入第三个参数，就理解为获取对应标签、对应样式的值
    
19. function css(id,cssName,cssValue){
    
20.    
    
21. }
    
22. //按传入标签的ID聚焦
    
23. function focus(id){
    
24.    
    
25. }
    
26. 
    
27. //当文档加载完成后执行
    
28. function ready(callback){
    
29.    
    
30. }
    
31. //当标签被单击时执行
    
32. function click(id,callback){
    
33.    
    
34. }

复制代码

如何将JS文件1，分拆成下面的两JS文件

AlexFung

意思就是第三片代码的括号里内容应该怎样填写？