jquery代码编写规范
jquery代码编写规范
webxiaohua 发表于3年前
jquery代码编写规范
  • 发表于 3年前
  • 阅读 15
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 十分钟定制你的第一个小程序>>>   

摘要: JS写多了变不好维护,所以下面是我在网上找的例子加我工作几年下来的一个JQUERY编写模式
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>
    <title></title>
    <script src="Scripts/jquery-1.8.2.min.js"></script>
</head>
<body>
    <input id="a"/>
    <span id="aa">注册事件</span>
    <script>
        //...其他用到的变量
        var$$ = window.$$ = {
            //从后台获取的JSON数据统一放到这个对象中,以便其他函数调用
            jsons: {},
            //....更多需求,一个需求对应一个函数
            main: function() {
                $$.moreFun1();//统一调用接口
                $$.moreFun2();
                $$.moreFun3();
                $$.moreFun4();
                //....在main主函数中调用它们。
                //统一事件注册
                $$.eventOn();
            },
            aid: "aid",//变量
            bid: "bid",
            cid: "cid",
            jsonId: "jsonId",
            jsonId2: "jsonId2",
            $a:$("#a"),//选择器
            $aa:$("aa"),
            //清空$$
            disponse: function() {
                $$ = null;
            },
            //取消页面所有事件
            eventOff: function() {
 
            },
            //页面事件统一注册
            eventOn: function() {
                console.log($$.jsons[$$.jsonId].id);
                $$.$a.click(function() {
                    console.log("点击了事件");
                })
                $$.$aa.change(function() {
 
                })
            },
            //....更多的私有函数
            //功能1
            moreFun1: function() {
                console.log("1");//控制台打印函数IE F12调式工具控制台能看到输出,谷歌火狐也有, 你也可以用alert(1)来查看调用不过这样会弹出框比较不爽 具体使用可以百度一下
                $$.jsons[$$.jsonId] = {id:"我是JSON"};
            },
            //功能2
            moreFun2: function() {
                console.log("2开始执行");
                console.log("2执行结束");
            },
            //功能3
            moreFun3: function() {
                console.log("3");
            },
            //功能4
            moreFun4: function() {
                console.log("4");
            },
            //功能5
            moreFun5: function() {
 
            }
        }
        $(function() {
            $$.main();//执行接口
        });
    </script>
 
</body>
</html>



标签: JQuery代码规范
共有 人打赏支持
粉丝 10
博文 39
码字总数 25544
×
webxiaohua
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: